Exemple html de code :
Exemple de zones cliquables
Exemple
Passez la souris sur l'image, cliquez sur la zone. et revenez sur l'image avec la barre de scroll sans cliquez dans la page, vous verrez alors la zone, mais cela dépend du navigateur.
Zone rectangulaire
<map name="Map">
<area shape="rect" coords="23,11,77,41" href="#">
</map>
Zone circulaire
<map name="Map">
<area shape="circle" coords="46,28,19" href="#" >
</map>
Zone polygonale
<map name="Map">
<area shape="poly" coords="75, 22, 59, 40, 54, 27, 27, 34, 23, 18, 39, 13, 63, 12, 73, 22" href="#">
</map>
Une Zone rectangulaire, circulaire et polygonale
<map name="Map">
<area shape="rect" coords="7,9,43,37" href="#">
<area shape="circle" coords="82,24,16" href="#">
<area shape="poly" coords="130, 12, 149, 20, 166, 12, 184, 20, 172, 32, 156, 34, 136, 36" href="#">
</map>
Zone rectangulaire
Exemple de code :
<img src="../../images/balise/rouge.gif" width="100" height="50" usemap="#Map" border="0"> <map name="Map">
<area shape="rect" coords="23,11,77,41" href="#">
</map>
Zone circulaire
Exemple de code :
<img src="../../images/balise/rouge.gif" width="100" height="50" border="0" usemap="#Map"> <map name="Map">
<area shape="circle" coords="46,28,19" href="#" >
</map>
Zone polygonale
Exemple de code :
<img src="../../images/balise/rouge.gif" width="100" height="50" border="0" usemap="#Map"> <map name="Map">
<area shape="poly" coords="75, 22, 59, 40, 54, 27, 27, 34, 23, 18, 39, 13, 63, 12, 73, 22" href="#">
</map>
Une Zone rectangulaire, circulaire et polygonale
Exemple de code :
<img src="../../images/balise/rouge.gif" width="200" height="50" border="0" usemap="#Map"> <map name="Map">
<area shape="rect" coords="7,9,43,37" href="#">
<area shape="circle" coords="82,24,16" href="#">
<area shape="poly" coords="130, 12, 149, 20, 166, 12, 184, 20, 172, 32, 156, 34, 136, 36" href="#">
</map>