Multiple Image Maps in HTML

Let's begin by coding the page as a normal Web page with rollovers. It looks like Example 3-1 (notice the three images at the bottom).

Example 3-1. Home page with rollovers
 <html> <head> <title>Welcome to Shelley Biotech!</title> <style type="text/css"> #header { position: absolute; left: 36; top: 31; } #nav { position: absolute; left: 0; top: 122; } #gal { position: absolute; left: 515; top: 74; } #submenu { position: absolute; left: 33; top: 163; } </style> <script language="JavaScript"> // preload images newsOn = new Image() newsOn.src = "images/nav_news_on.gif" newsOff = new Image() newsOff.src = "images/nav_news_off.gif" productsOn = new Image() productsOn.src = "images/nav_products_on.gif" productsOff = new ...

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.