Installation:
STEP 1 .
Make 2 images which you would like to display. You can name them #1 and #2 if you wish and they can be jpg or gif format. Upload the images to your server.
STEP 2
Copy the code below and paste this between the <head> and </head> tags of your html document.
<script language="Javascript">
<!-- www.hypergurl.com
if (document.images)
{ image1 = new Image image2 = new Image image1.src = 'images/rollover1.jpg'
image2.src = 'images/rollover2.jpg' } -->
</script>
Point the script to where the images reside
on your webhost. By this I mean change image source lines:
image1.src = ' images/rollover1.jpg ' and
image2.src=' images/rollover2.jpg '
The lines in red should show where your images are stored and your image name.
STEP 3.
Copy the code below and paste this into the body of your html document,
where you want the images to appear on your webpage.
<a href="http://www.javascriptwebdesigns.com"
onMouseOver="document.rollover.src=image2.src" onMouseOut="document.rollover.src=image1.src">
<img src="images/rollover1.jpg" border=0 name="rollover"></a>
Again change the image source to suit at this line; img src= "images/rollover1.jpg"
(Note that you only need to change the image1 here. The second image
is called by the script.)