Javascript image src

E

euronay

Hi

I'm pretty rubbish at java and I'm trying to get an image to change
when a user clicks a link.

I don't know why this doesn't work. Can anyone help?

foc.src=foc.src=='1.gif'?'2.gif':'1.gif';

foc is the image element - if i do foc.src='2.gif' it will quite
happily change but I want it to alternate between the two images every
time the link is clicked.

Thanks in advance
 
J

jshanman

is this code in a function that is called on an "onclick" event? If so,
please post the HTML code, and the javascript function.
 
I

Ivo

foc.src=foc.src=='1.gif'?'2.gif':'1.gif';

foc is the image element - if i do foc.src='2.gif' it will quite
happily change but I want it to alternate between the two images every
time the link is clicked.

Although you eset the src to '1.gif', the browser will make it the full
http://yoursite/path/1.gif.
So in the test, check that '1.gif' is part of the string, with
foc.src.indexOf( '1.gif' ) or so. If you have 11.gif and 21.gif, the check
needs to do a little more work.
 
E

euronay

Cheers Ivo, that worked an absolute treat. :)

My first ever post on usenet and my problem solved in 15 minutes.
Awsome guys. Thanks.
 
N

Nays

OK, so my little image script i managed to get working but not in
firefox. The Firefox java console says:

Error: foc.src has no properties
Source File: file:///.../test.htm
Line: 39

My code in full is:

function dsp(loc){
if(document.getElementById){
var foc=loc.firstChild;
foc=loc.firstChild;
if(foc.src.indexOf('down.gif')>0){
foc.src = 'up.gif';}
else{
foc.src = 'down.gif';}
foc=loc.parentNode.nextSibling.style?
loc.parentNode.nextSibling:
loc.parentNode.nextSibling.nextSibling;
foc.style.display=foc.style.display=='block'?'none':'block';}}

This is called like so:

<div class="header"><a href="javascript:void(0)" class="dsphead"
onclick="dsp(this)">
<img src="down.gif" border="0"></img>Test</a></div>
<div class="dspcont">
Content - yay!
</div>

Do any of you guys know how i can get the image 'src' value in firefox?
Or if this is impossible - detect the fact that it is firefox and go
straight to setting the divs style property because i know that the div
will work.

Thanks again
 
H

Howard Jess

Nays wrote:

My code in full is:

function dsp(loc){
if(document.getElementById){
var foc=loc.firstChild;
foc=loc.firstChild;

You're setting foc twice here; is that a typo? And, you're assuming,
without checking, that foc refers to an IMG element.
if(foc.src.indexOf('down.gif')>0){
foc.src = 'up.gif';}
else{
foc.src = 'down.gif';}
foc=loc.parentNode.nextSibling.style?
loc.parentNode.nextSibling:
loc.parentNode.nextSibling.nextSibling;
foc.style.display=foc.style.display=='block'?'none':'block';}}

This is called like so:

<div class="header"><a href="javascript:void(0)" class="dsphead"
onclick="dsp(this)">
<img src="down.gif" border="0"></img>Test</a></div>

Notice that there's a bit of (whitespace) text between the end of the
div tag and the beginning of the img tag. *That" is a Text node, and
is the firstChild of the div element whose reference is passed to
the function dsp. IE often eliminates these.

[Omitting comments about the javascript: protocol; I'm sure others will
do so.]

A less fragile construction might be (untested)

function dsp(imgID,divID) {
var img = document.getElementById(imgID),
div = document.getElementById(divID);
if (img != null) {
if (img.src.indexOf('down.gif') >= 0) img.src = 'up.gif';
else img.src = 'down.gif';
}
if (div != null && div.style != null)
div.style.display = (div.style.display == '' ? 'none' : '');
}

and

<div class="header"><a href="#here" name="here" class="dsphead"
onclick="dsp('downImg','cntDiv');return false"><img id="downImg"
src="down.gif" border="0">Test</a></div>
<div id="cntDiv">Content - Yay!</div>


hj
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top