Contents Home Page Previous Page Next Page

Mouseover in Image Maps

In the same way that the status bar can be used to display descriptions of normal links with the aid of JavaScript, as shown on a previous page, it can also be used for image maps.

An image map
yellow red blue green

On a side note, users of Internet Explorer 3 and better and Netscape 4.x will be accustomed to seeing a 'tooltip' pop up when the mouse is over an image, with a description of the image. This is, of course, defined by the ALT attribute of the <IMG> tag. It is particularly useful with graphical links, as you can use the ALT text to describe the destination fully. It is, of course, also important that you remember its prime purpose, which is to aid those with text browsers, or those who have the graphics switched off. In image maps, however, although the <AREA> tag takes the ALT attribute (in fact it is required), Internet Explorer and Netscape do not show it.

There is a work around, though, which works in at least the version 4 browsers; I'm not sure about IE 3.x, but Netscape 3.x does not support it -- perhaps someone with IE 3.x could let me know. This is to use the TITLE attribute in exactly the same way as you use ALT. In fact, in Internet Explorer 4.x (but not Netscape) this attribute works with all sorts of tags; for example, place your mouse over this link.

Now place your mouse over this paragraph... See what I mean? By the way, you can force line breaks, as in the 'tooltip' for the link in the paragraph above, using a Carriage Return or Line Feed entity (&#13; or &#10;). It's that simple.