Switch image by variable with Javascript

Question

I'm writing an image gallery script in which the thumbnail for the currently-viewed image is indicated with a smaller image below the thumbnail. My placeholder is as follows:

<img name="indicator0" alt="indicator>

with indicator1, indicator2, etc. following. In my script, which placeholder has the indicator is called by the variable thumbIndicator. I'd like to be able to do that like this:

document.(thumbIndicator).src = "indicator_image.jpg";

but this has not worked. I've also changed my image placeholder to this:

<img id="indicator0" alt="indicator">

and the script to this:

document.getElementByID(thumbIndicator).src = "indicator_image.jpg";

but that hasn't worked either.

I have been designing websites for a while now, have a fair amount of experience with PHP/MySQL, but am new to JavaScript. Any help is greatly appreciated.

So is it the case that this can't be done with a variable? I can get it to work by passing a string to getElementId, but I'd like to pass a variable, since there are multiple placeholders. Sounds like it's not possible? — user704325
– user704325, Commented Apr 12, 2011 at 14:58

penguinrob · Accepted Answer · 2011-04-12 03:28:08Z

3

You need to set the ID of your placeholder image, (which you might be doing, just not in the code above).

<img id="thumbIndicator" alt="alternate text" />

Then to get it:

document.getElementById("thumbIndicator").src = "newfile.png";

In your above code, getElementById had both I and D capitalized, just the I actually is, though.

answered Apr 12, 2011 at 3:28

penguinrob

1,4593 gold badges18 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

SLaks · Accepted Answer · 2011-04-12 03:25:46Z

0

You need to pass a string to getElementById:

document.getElementByID("thumbIndicator")

answered Apr 12, 2011 at 3:25

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

Comments

Bruce Aldridge · Accepted Answer · 2011-04-12 03:27:51Z

0

<img src="oldsrc" id="thumbindicator" />

then

document.getElementById('thumbindicator').src = 'newsrc.jpg';

answered Apr 12, 2011 at 3:27

Bruce Aldridge

2,9374 gold badges23 silver badges31 bronze badges

Collectives™ on Stack Overflow

Switch image by variable with Javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related