Generic swap image

[happyandrea]

Hello all,

i am trying to do a script that let me change the src of an image when someone click on it. When the second image (a bigger image) appear and the user hit the image with a second click, appears the first image. And so on.

This is what i've done:

var newImage;

function swapImage(nomeid, newImage) { 
if(document.getElementById('nomeid').src == newImage) { 
document.getElementById('nomeid').src = "images/"+nomeid+"_big.jpg"; 
}else{ 
document.getElementById('nomeid').src = newImage; 
} 
}

and

<IMG id="image1" SRC="images/image1.jpg" onClick="swapImage(image1,'images/image1.jpg')" />

But it dosn't work.
I need a generic script to be used easily in a page with a large number of images... and as u can see I don't know JS so much

Thanks for any hint...

[Philip M]

Search Google for javascript rollover which will bring up lots of scripts.


Quizmaster: What "R" was Hilary Clinton's maiden name?
Contestant: Er, um . .. is it Rottweiler?

[happyandrea]

Already tried, but i cannot find what i'm looking for

[freedom_razor]

Here you go:

function swapImage(nomeid, newImage) { 
if(document.getElementById(nomeid).getAttribute('src') == newImage) { 
document.getElementById(nomeid).src = "images/"+nomeid+"_big.jpg"; 
}else{ 
document.getElementById(nomeid).src = newImage; 
} 
}

And your IMG tag:

<img id="image1" src="images/image1.jpg" onClick="swapImage('image1','images/image1.jpg')" />

[happyandrea]

It's perfect... thanks a lot man!

So was the "getAttribute('src')" missing... I'll go study some JS

[freedom_razor]

Well, there were few errors there, you can compare codes and see them [too many '' ]. And this document.getElementById('nomeid').src == newImage wasn't working, because left side returns full path to image, and you were comparing it to relative path, so it was never the same.