Menu
Beginning images:
Example: A B
When you click on img A // this change B to C
img B // this change A to D
now we have: D C
I am trying to figure out how I can reverts these images back to A B as in the beginning.
I have try using another function such as
function changeImgBack
but I can’t get it to change…I also tried multiple ways but not luck. I would appreciate your help on this matter. Here is what I have so far…I didn’t included the different ways I have tried.
if (document.images) {
// if images are supported by the browser, create an array of images and preload them
var myImage = new Array() // list Images
myImage[0] = new Image()
myImage[0].src = “images/image1.gif”
myImage[1] = new Image()
myImage[1].src = “images/image2.gif”
myImage[2] = new Image()
myImage[2].src = “images/image3.gif”
myImage[3] = new Image()
myImage[3].src = “images/image4.gif”
function changeImg(valueClick) {
if (valueClick == 0) {
document.images[1].src = myImage[2].src
} else if (valueClick == 1) {
document.images[0].src = myImage[3].src
} else {
alert(“Houston, we have a problem”)
}
return false; //prevent click from going anywhere
}
}
</script>
</head>
<body>
<table width=”300″ border=”0″>
<tr>
<td><a href=”Lab4.2.html” onClick=”changeImg(0);return false;”><img src=”images/image1.gif” name=”img1″ width=”300″ height=”150″
>
</a></td>
<td><a href=”Lab4.2.html” onClick=”changeImg(1);return false;”><img src=”images/image2.gif” name=”img2″ width=”300″ height=”150″
>
</a></td>
</tr>
</table>
</body>
</html>