Client-Side Image Maps

Client-side image maps are created by placing the appropriate HTML code in the page itself.

Each image used as an image map must have its own ... <MAP>.......</MAP> definition in the document. The MAP tag must have a NAME attribute that assigns a unique name to this particular image map.

For example the NAME attribute for the cube below (figure 2) is 'cube'.

By looking at the following html code (which should be enclosed with quotes (<....>)

img src="images/cube2.gif" width="200" height="200" usemap="#cube" border="0"

it can be interpreted as:

The image source is 'cube' and can be found in the 'images' folder that lies within the web folder for this document. The height and width of the cube are also contained in the line and no border has been applied.

(Figure 2)

Only three of the coloured rectangles have 'hot spots' - as the mouse is moved over the cube a hand will appear where the link is embedded. The link also appears in the toolbar at the bottom of the page. When the 'hotspot' has been clicked, the user will be taken to the intended link (URL)





Green pink yellow