Gargravarr
06-27-2007, 04:17 AM
I found a very-nice code that replaces one image for another when i run my mouse over it (the images are links). It works perfectly for one image, but if i add another image it ignores the second one. The code looks like this:
<html>
<head>
...
<script language="JavaScript" type="text/javascript">
<!--
function offtg() {
document.tg.src = Image1.src; return true;
document.album.src = Image38.src; return true;
}
function ontg() {
document.tg.src = Image2.src; return true;
document.album.src = Image26.src; return true;
}
Image1= new Image(40,40)
Image1.src = "tg.png"
Image2 = new Image(40,40)
Image2.src = "bordercd.png"
Image38= new Image(1,12)
Image38.src = "blank1.png"
Image26= new Image(70,12)
Image26.src = "3thegallery.png"
//-->
</script>
...
</head>
<body>
...
<img border=0 src=blank1.png name="album" height=12>
<br>
<br>
<a href="..." onMouseOver="ontg()" onMouseOut="offtg()"><img name="tg" border=0 height=40 width=40 src=tg.png></a>
...
</body>
</html>
So i define the images as Image26, Image38, etc and then i replace the images with the ontg() and offtg() codes and everything's perfect... in theory. What it does is just replace the first image in each script (Image1 in offtg() and Image2 in ontg()) and pretend that the code line for the second image in each script (Image38 and Image26, respectively) aren't there (it replaces tg.png with bordercd.png and vice-versa, but it doesn't replace blank1.png with 3thegallery.png). What's wrong with my code?
Thanks in advance.
<html>
<head>
...
<script language="JavaScript" type="text/javascript">
<!--
function offtg() {
document.tg.src = Image1.src; return true;
document.album.src = Image38.src; return true;
}
function ontg() {
document.tg.src = Image2.src; return true;
document.album.src = Image26.src; return true;
}
Image1= new Image(40,40)
Image1.src = "tg.png"
Image2 = new Image(40,40)
Image2.src = "bordercd.png"
Image38= new Image(1,12)
Image38.src = "blank1.png"
Image26= new Image(70,12)
Image26.src = "3thegallery.png"
//-->
</script>
...
</head>
<body>
...
<img border=0 src=blank1.png name="album" height=12>
<br>
<br>
<a href="..." onMouseOver="ontg()" onMouseOut="offtg()"><img name="tg" border=0 height=40 width=40 src=tg.png></a>
...
</body>
</html>
So i define the images as Image26, Image38, etc and then i replace the images with the ontg() and offtg() codes and everything's perfect... in theory. What it does is just replace the first image in each script (Image1 in offtg() and Image2 in ontg()) and pretend that the code line for the second image in each script (Image38 and Image26, respectively) aren't there (it replaces tg.png with bordercd.png and vice-versa, but it doesn't replace blank1.png with 3thegallery.png). What's wrong with my code?
Thanks in advance.