PDA

Click to See Complete Forum and Search --> : Rollover / Rollback

EmpNorton
12-13-2003, 03:07 AM
I would like to have an image (actully a series of images) that swap on mouseover (not hard), but swap back when the mouse rolls over the image again. In other words, it doesnt swap back on mouseout, but on another mouseover.

Anyone have a clue?
AdamGundry
12-13-2003, 05:12 AM
Something like this?

<img src="image1.gif" onmouseover="swapImage(this, 'image1.gif', 'image2.gif')">

<script type="text/javascript">
function swapImage(element, img1, img2){
if (element.src == img1){
element.src = img2;
} else {
element.src = img1;
}
}
</script>

Adam
EmpNorton
12-13-2003, 12:33 PM
That seems like it should work, but I dont have much JS experience. How do I implement this?
AdamGundry
12-14-2003, 02:36 PM
Put the <script> section in the <head> of your HTML page, then use the top line to put in an image. In this case, "image1.gif" is the first image and "image2.gif" is the image it swaps to, but you can change the filenames.

Adam