How to Make an Image Map?
The html image map <map> is a list of coordinates relating to a specific image created in order to hyperlink areas of the image to different destinations. The <map> tag is supported in all major browsers. Attributes consist of a name and a value separated by an equals (=) sign, with the value surrounded by double quotes.
Indroduction
- Image Map is an image with clickable areas.
- There are three HTML elements used to create image maps - img, map and tag
- Map Shape attribute is rect, circle & poly
- Coordinates - left, right, Size
<img src ="sample_img.jpg" width="150" height="150" alt="Sample Map" usemap="#sampleMap">
<map name="sampleMap">
<area shape="rect" coords="10,15,67,72" href="test1.htm" alt="rect image">
<area shape="circle" coords="110,104,30" href="test2.htm" alt="circle image">
</map>
<map name="sampleMap">
<area shape="rect" coords="10,15,67,72" href="test1.htm" alt="rect image">
<area shape="circle" coords="110,104,30" href="test2.htm" alt="circle image">
</map>
