Balise AREA
Rôle
La balise <area> définir la zone cliquable d’une image. Elle se comporte comme un lien
Testez vous-même cette balise
Utilisez Codepen. La source de l’image est fournit par le site lorempixel.com
Remarque : pour relier la carte à l’image, on utilise l’attribut usemap de la balise <img>
Voici le resultat
Dans cette exemple, cliquer sur le chat du milieu pour vous diriger vers le site http://www.ohmycat.fr/
Compatibilité
La balise <area> est pris en charge par tous les principaux navigateurs.
Attributs spécifiques
- alt
- Spécifie la texte alternative à l’image si le navigateur ne l’affiche pas
- href
- Spécifie la destination du lien
- shape
- Spécifie la forme de la zone cliquable : circle pour une forme circulaire, rect pour une forme rectangulaire et poly pour une forme polygonale
- coords
- Spécifie les coordonnées (en pixel) de la zone cliquable :
- x,y,r pour le cercle (x,y étant la position du centre et r le rayon).
- x,y,x,y pour une forme rectangulaire (x,y du point en haut à gauche du rectangle et x,y du point en bas à droite du rectangle).
- x1,y1,x2,y2,x3,y3.. pour une forme polygonale (x,y de chaque point du polygone)
La balise <area> prend aussi en charge les attributs globaux
Voir les autres balises d’intégration
audio– canvas– embed– figcaption– figure– iframe– img– map– object– param– source – track– video
