// This statement detects if the browser supports the image object
if (document.images) {

//This section instantiates or creates the image objects
//You can also add the width and height of the images inside the parentheses seperated by a comma
image1 = new Image();
image2 = new Image();

//This section specifies the location or url of the images to be used
image1.src = "image1.jpg"
image2.src = "image2.jpg"
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<!-- To produce the rollover effect you will use the onMouseove/onMouseout event
handlers. You must give your image tag an id. To do that you will just add the
name attribute(ie. <img name="myimage"> ) inside of the image tag. Then
refer to the image you would use "document" which refers to the page that the
image tag resides in followed by a period and the you type the name you gave
to the image with the name attribute and then another period and type "src=".
The src is what you assigned to the location of the image to be changed back
in the script(ie. image1.src). If you wanted to change an image located in
another frame then the statement in your onMouse event handler would look
something like this:
onMouseover="parent.framename.document.rollover.src=image2.src"
You will just need to add a path to the other image. In this case you refer to the
parent window and the the framename and then continue the statement as usual.
One final note- In the HREF if you want an actual link to another page then just
put the link in there. If you do not want to link to another page then you can
just use the following to disable the HREF portion: HREF="javascript:void(null);"
-->
<A HREF="somewhere.html" onMouseover="document.rollover.src=image2.src" onMouseout="document.rollover.src=image1.src">
<IMG SRC="image1.jpg" border="0" name="rollover"></A>
</BODY>
</HTML>