Welcome to WebmasterWorld Guest from 220.127.116.11
Forum Moderators: open
1. Load the rollover images into the browser's cache
2. Name the spot where all graphics appear by using the "name=" attribute in the <img> tag
3. Detect onMouseOver and onMouseOut events in the anchor tag, NOT the <img> tag
4. Change the source file for the named image with each mouse position change
The BASICS, to rollover from image1.gif to image2.gif and back again, in the screen position I named "spot":
In the HEAD
In the BODY
<a href="url.html" onMouseOver="spot.src=over.src" onMouseOut="spot.src='image1.gif'"><img src="image1.gif" name="spot" width="ww" height="hh"></a>
<Hi. Thanks so much. I tried your code, and it didn't work - am I missing something?>
The reason it didn't work is the name is wrong in the image tag.
It should be the same as in the mouseover call - i.e. top.
The following code will work if you have images called RANDOM_OVER.GIF and RANDOM.GIF in thew same folder.
<a href="http://WWW.WHATEVER.COM/RANDOM.HTM" onmouseover="top.src='RANDOM_OVER.GIF" onmouseout="top.src='RANDOM.GIF">
<img name="top" src="RANDOM.GIF" width="50" height="50" border="0" alt="YOUR MESSAGE HERE"></a>