onMouseOver Action in Image Maps

JavaScript for onMouseover Actions in Image Maps

Displays in status line. (Don't click unless you want to go there!)

Copy-N-Paste Window

Simply copy (type Control-c or Apple-c) the script from the window below. Then paste it (type Control-v or Apple-v) into your text editor and save (Control-s or Apple-s).

<HTML><HEAD>
<TITLE>onMouseOver Action in Image Maps</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from JS-Impaired Browsers
/* In this script, the onMouseOver= calls
   are placed inside the map definitions.
   Note that the call requires the return
   true statement to allow the array
   variable to be displayed in the status
   line.  At present, I haven't found a
   way to suppress the onClick actions if
   they occur within an image map, so you
   might as well include the HREF= inside
   the map as well.  */

var flg=0;
/* In this array both the URL and the message
   were included, since lots of folks like the
   destination displayed.  Notice that spaces
   may be included for your display. They will
   not be ignored as they would be in straight
   HTML. */
var msg=new Array();
msg[0]="http://www.netscape.com/"
+"      Check Out the Latest from Netscape!";
msg[1]="http://www.jorika.com"
+"      Download Free Books and CD's from WebWalker!";
msg[2]="http://www.infohiway.com/faster"
+"      Tips and Tricks for Developers";
function dispIt(){
 window.status=msg[flg];
 }
// End Hiding -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR="white"><CENTER>
<P><B>JavaScript for onMouseover Actions in Image Maps</B>
<P>Displays in status line. (Don't click unless you want to go there!)
<P><IMG SRC="imgmp.gif" WIDTH="340" HEIGHT="216" BORDER="0" ISMAP
 USEMAP="#menu">
<MAP NAME="menu">
<AREA SHAPE="rect" HREF="http://www.netscape.com/" COORDS="0,0,340,71" onMouseOver="flg=0;dispIt();return true;">
<AREA SHAPE="rect" HREF="http://www.jorika.com" COORDS="0,72,340,143" onMouseOver="flg=1;dispIt();return true;">
<AREA SHAPE="rect" HREF="http://www.infohiway.com/faster" COORDS="0,142,340,215" onMouseOver="flg=2;dispIt();return true;">
</MAP>
</BODY>
</HTML>