rollover images

here is a simple tutoral on how to make rollover images. These are great for layouts. I've used them in mine :)

take two images

copy this code onto your page

<script TYPE="text/javascript"> <!-- // copyright 1999 Idocs, Inc. http://www.idocs.com/tags/ // Distribute this script freely, but please keep this // notice with the code. var rollOverArr=new Array(); function setrollover(OverImgSrc,pageImageName) { if (! document.images)return; if (pageImageName == null) pageImageName = document.images[document.images.length-1].name; rollOverArr[pageImageName]=new Object; rollOverArr[pageImageName].overImg = new Image; rollOverArr[pageImageName].overImg.src=OverImgSrc; } function rollover(pageImageName) { if (! document.images)return; if (! rollOverArr[pageImageName])return; if (! rollOverArr[pageImageName].outImg) { rollOverArr[pageImageName].outImg = new Image; rollOverArr[pageImageName].outImg.src = document.images[pageImageName].src; } document.images[pageImageName].src=rollOverArr[pageImageName].overImg.src; } function rollout(pageImageName) { if (! document.images)return; if (! rollOverArr[pageImageName])return; document.images[pageImageName].src=rollOverArr[pageImageName].outImg.src; } //--> </script> <A HREF="" onMouseOver="rollover('home')" onMouseOut="rollout('home')"><IMG SRC="IMAGEURL1" NAME="home" ALT="" BORDER="0"></A> <script TYPE="text/javascript"> <!-- setrollover("IMAGEURL2"); //--> </script>

where it says IMAGEURL1 copy your first image url and where it says IMAGEURL2 copy your second image url simple as that =D

heres an example