Créer une image en coordonnées (Image Map)
- L'image ci-dessous contient deux zones de coordonnées qui sont des hyperliens à d'autres documents HTML - dans ce cas, il s'agit simplement d'autres fichiers de notes de cours mais, les liens pourraient être n'importe quoi.
- Souvent on utilise un "Image Map" dans la page d'accueil pour acheminer le visiteur vers d'autres pages du site.
![]()
- Le code qui utilisé pour créer cette image est le suivant:
- On doit d'abord spécifier l'image qu'on veut utiliser - on crée un tag <IMG ...> normal mais, il doit contenir un paramètre additionnel qu'on écrit comme: USEMAP = "#nomdemap"
- Puis on crée un nouveau tag pour décrire la map:
<MAP NAME = "nomdemap">
- Finalement on crée les tags <AREA ...> pour spécifier les coordonnées et les liens
- Si la forme choisie est un cercle, on écrit SHAPE="CIRCLE" et on spécifie les coordonnées du centre du cercle et le rayon avec COORD=X,Y,rayon
- notez que le point (0,0) de l'image est le coin supérieur gauche et que toutes les mesures sont en pixels
- Si la forme choisie est un rectangle, le programme va insérer les lignes de code suivantes dans votre document :
<IMG SRC="uneImage" USEMAP="#unNom">
<MAP NAME="unNom">
<AREA SHAPE="RECT" COORDS="X,Y,largeur,hauteur"
HREF="unDocument1.HTM">
<AREA SHAPE="RECT" COORDS="X,Y,largeur,hauteur"
HREF="unDocument2.HTM">
</MAP>