Image map not working

Get Started
1

Hi,

I have created an image map and it is not working in any browsers.

Here is the code:

<div id=“locations_left_right”><img src=“images/map3.png” width=“90%” usemap=“#imgmap201331112850” border=“0”>

<map id=“imgmap201331112850” name=“imgmap201331112850”>
<area shape=“circle” alt=“Sheffield” coords=“403,789,25” href=“clinics_sheffield.html” />
<area shape=“circle” alt=“Wilmslow” coords=“321,835,23” href=“clinics_wilmslow.html” />
<area shape=“circle” alt=“Birmingham” coords=“351,933,25” href=“clinics_birmingham.html” /><area shape=“circle” alt=“Watford” coords=“559,1043,23” href=“clinics_watford.html” />
<area shape=“circle” alt=“Brentwood” title=“” coords=“608,1058,26” href=“clinics_brentwood.html.html” />
<area shape=“circle” alt=“Maidenhead” coords=“512,1092,24” href=“clinics_maidenhead.html” />
<area shape=“circle” alt=“London, Wimpole Street” coords=“571,1093,25” href=“clinics_london_wimpole_street” />
<area shape=“circle” alt=“Hayward’s Heath” coords=“554,1148,24” href=“clinics_haywards_heath.html” />
<area shape=“circle” alt=“Southampton” coords=“474,1186,24” href=“clinics_southampton.html” />
<area shape=“circle” alt=“Bournemouth” coords=“395,1209,23” href=“clinics_bournemouth.html” />
</map>
</div>

Any help with this would be greatly appreciated. Thanks.

2

Hi,
The code is good. The problem can be from coords according to image size.
For shape=“circle” the first 2 coords give the center of the circle, the 3rd coord is for radius; coords=“x_px, y_px, radius_length_px”'.

3

Hmm. You can have; rect | circle | poly | and COORDS=“left, top, right, bottom”. For rect: left-x, top-y, right-x, bottom-y; the circle, which specifies a circular region using COORDS=“centre-x, centre-y, radius”; poly, which specifies a polygonal region using COORDS=“x1, y1, x2, y2, …, xN, yN”. The first x and y coordinate pair and the last should be the same to close the polygon.

Coordinate values are relative to the top left corner of the object and may be expressed as pixels or percentages. Though the image map dimensions for the IMG should be defined in pixels NOT percentages. What is the size of the image itself, i.e. width and height attribute values in pixels? As those numbers look big and without the map itself it’s harder to see where they are supposed to be.

4

Hi, thanks for your replies. It is to do with the image not being a fixed width.

5

Yes, like I mentioned in post #3 that IMG should be defined in Pixels not Percentages, glad you got it working though.