Mouse-Over Links


Example:

First, put the following code in the head of the document:
<SCRIPT language="JavaScript">

<!-- Begin
function movepic(img_name,img_src) {
document[img_name].src=img_src;
}
// End -->
</SCRIPT>


The code for the image and link should look like this:

<A HREF="linkpage.html" onmouseover="movepic('loco','coolimage2.gif')" 
onmouseout="movepic('loco','coolimage1.gif')">
<IMG NAME="loco" SRC="coolimage1.gif" border=0>
</a>

Both images should be the same size. Multiple mouse-over images may be used on the same page. Each image should have its own name (loco in this example).

If desired, a different image may be used when the mouse moves off of the image. In that case, the link should look like this:
And the link should look like this:
<A HREF="linkpage.html" onmouseover="movepic('meow','coolimage2.gif')" 
onmouseout="movepic('meow','coolimage3.gif')">
<IMG NAME="meow" SRC="coolimage1.gif" border=0>
</a>