homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

switching around images in JavaScript

Msg#: 4424840 posted 11:42 pm on Mar 4, 2012 (gmt 0)

I'm trying to create a javascript code that'll let me replace a thumbnail image by clicking one of three smaller identical images beside it. Unfortunately, I can not get the code to function as I wish. I am not allowed to alter the existing HTML code, so I am pretty much forced to do this with pure javascript.

This is what I've inititially put together.


function setupPhotos(){
var smallpics0 = "images/small/black_bear.jpg";
var smallpics1 = "images/small/black_bear1.jpg";
var smallpics2 = "images/small/black_bear2.jpg";

function photo0(){
var img = new Image();

function photo1(){

function photo2(){

Can somebody please help me find out what I'm doing wrong here? I really need some help here.



WebmasterWorld Senior Member fotiman us a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month

Msg#: 4424840 posted 3:14 pm on Mar 5, 2012 (gmt 0)

Welcome to WebmasterWorld!

var smallpics0 = "images/small/black_bear.jpg";

smallpics0 is the string "images/small/black_bear.jpg"


The onclick handler of the string "images/small/black_bear.jpg" is photo0?

You need to attach the handler to an element, not to a string.


5+ Year Member

Msg#: 4424840 posted 8:09 pm on Mar 5, 2012 (gmt 0)

I'm making some assumptions here so forgive me if it's not entirely the answer you need and it just formed out of my head and it's my first time trying to help here with code:

var d=document,
imgs = d.getElementsByTagName('img');

for(var i=0; i<imgs.length; i++){

d.getElementById(bear-thumb).src = 'images/small/black_bear0.jpg';
d.getElementById(bear-thumb).src = 'images/small/black_bear1.jpg';
d.getElementById(bear-thumb).src = 'images/small/black_bear2.jpg';

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved