JavaScript
Rollovers
with image maps
This is the code:
<![CDATA[
<HTML>
<HEAD>
<TITLE>Rollovers with image maps</TITLE>
<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
<!-- Hide script from old browsers
if (document.images) {
img1 = new Image
img2 = new Image
img3 = new Image
imgRed = new Image
img1.src = "image2.gif"
img2.src = "image3.gif"
img3.src = "image4.gif"
imgRed.src = "image1.gif"
}
else {
img1 = ""
img2 = ""
img3 = ""
imgRed = ""
document.roll = ""
}
// End hiding script from old browsers -->
</SCRIPT>
</HEAD>
<BODY>
<img usemap="#roll_map" src="image1.gif" border=0 name="roll" hspace=20><map name="roll_map">
<area shape="circle" coords="36,25,23" href="index.html" onMouseOver="document.roll.src=img1.src" onMouseOut="document.roll.src=imgRed.src">
<area shape="circle" coords="52,78,23" href="index.html" onMouseOver="document.roll.src=img2.src" onMouseOut="document.roll.src=imgRed.src">
<area shape="circle" coords="41,129,23" href="index.html" onMouseOver="document.roll.src=img3.src" onMouseOut="document.roll.src=imgRed.src">
</map>
</BODY>
</HTML>
]]>