Source Code

The source code is presented in two ways.
Use whichever is easiest for you.
</head>
<body>
</body>
</html>
<html>
<head>

<script type="text/javascript" language="JavaScript">
<!-- Two program lines per image to be preloaded
//
// Note: This code is necessary only if you preload the
//       rollover images.
//
// The location of this code determines when the images 
//    are loaded. Left here between the <HEAD... and <HEAD> 
//    section, the images will load before the rest of the 
//    page. However, if you put this code near the bottom 
//    of your page, just above the </BODY> tag, then the 
//    images will load last.
//
image1 = new Image();
image1.src = "bluefish.jpg";
image2 = new Image();
image2.src = "starfish.jpg";
image3 = new Image();
image3.src = "dolphin.jpg";
image4 = new Image();
image4.src = "goldfish.jpg";
image5 = new Image();
image5.src = "seal.jpg";
// -->
</script>

</head>
<body>

<IMG SRC="seefuntag.gif" NAME="therollover" 
HEIGHT=170 WIDTH=180 BORDER=0 ALT="See All the Fun">

<IMG SRC="seafunmap.jpg" HEIGHT=230 WIDTH=348  
ALT="imagemap" usemap="#seafunmap.jpg" border="0">

<map name="seafunmap.jpg">
     <area shape="rect" coords="0,0,223,54" 
          href="yourpage.html"
          onMouseOver="therollover.src='bluefish.jpg'"
          onMouseOut="therollover.src='seefuntag.gif'"
          alt="bluefish">
     <area shape="rect" coords="1,177,147,238"
          href="yourpage.html"
          onMouseOver="therollover.src='starfish.jpg'"
          onMouseOut="therollover.src='seefuntag.gif'"
          alt="starfish">
     <area shape="circle" coords="290,58,54" href="yourpage.html"
          onMouseOver="therollover.src='dolphin.jpg'"
          onMouseOut="therollover.src='seefuntag.gif'"
          alt="dolphin">
     <area shape="rect" coords="184,188,348,230"
          href="yourpage.html"
          onMouseOver="therollover.src='goldfish.jpg'"
          onMouseOut="therollover.src='seefuntag.gif'"
          alt="goldfish">
     <area shape="rect" coords="74,59,223,176"
          href="yourpage.html"
          onMouseOver="therollover.src='seal.jpg'"
          onMouseOut="therollover.src='seefuntag.gif'"
          alt="seal">
</map>

</body>
</html>