Well I used an image preloading to avoid net trafic when using roll-over butons (that change their images on mouse enter and leave). to do that, I used an hidden div (<DIV style="display : hidden">...<DIV>) in wich I put all the images that I need in the form of single IMG tags. Then on the onMouseEnter or onMouseLeave event, i Wrote "this.src=hiddenimage.src" instead of the path of the image. Water is not bad as soon as it stays out human body ;-)
<script>
if (document.images)
{
img1 = new Image();
img1.src = "images/photo1.gif";
img2 = new Image();
img2.src = "images/photo2.gif";
. . .
}
</script>
(it should be without any function!)
The most simple rollover script is this:
function swap(imgNumb,imgFile) {
if (document.images)
document.images
.src = eval(imgFile + '.src');
}
Call it like this:
<a href="..." onmouseover="swap('n1','img2')" onmouseout="swap('n1','img1')"><img src="images/photo2.gif" name="n1" ...></a>
This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
By continuing to use this site, you are consenting to our use of cookies.