This is a demonstration of Client Side Image Maps. The colored boxes are actually links:
Four Squares


Look at the source to get an idea of how these work. The coordinates are in absolute pixel values relative to the beginning of the image.

The image was created using PSP, which can be used to read the coordinates as well; in this case, the layout was such that the coordinate values were known by design.

Rectangular are (x,y) for upper left and lower right corners; circular are (x,y) coordinates for center, followed by radius.

Irwin

It is important to test image maps in different browsers. Irwin originally used AREA SHAPE="rectangle" and discovered that the map did not work in Netscape 4 (also true for NS3 we learned later) until he also added coordinates for a circle shape. Using AREA SHAPE="rect" instead works in Netscape. MSIE appears to accept either way of defining the shape. The tutorials and programs to create image maps that we found do use AREA SHAPE=RECT and the source code is changed to reflect this. This gets more confusing as AREA SHAPE="circle" seems to be the preferred definition while AREA SHAPE="circ" is not. Additional information on area leads to further confusion as both variations are given as acceptable to define shapes.


This page brought to you courtesy of GeoCities.