Image Map Information in JavaScript

It's also possible to place all of your image map information in JavaScript, with none of it being HTML. It turns out this creates much longer code, but it also allows you to alter an individual area's coordinates, href, target, and shape on the fly.

Since all of the image map information lives in the JavaScript, our HTML is pretty simple, as shown in Example 3-6.

Did you notice that the map tag has both a name and an id? It seems redundant, and in fact IE works fine with only id="submenuMap", but Netscape 6 also needs the name="submenuMap" in order to work.

Example 3-6. Submenu layer
 <div id="submenu"> <img src="images/white_block.gif" name="submenuImg" border="0" usemap="#subMenuMap"> <map name="submenuMap" ...

Get Advanced JavaScript™: Insights and Innovative Techniques now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.