Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
HTMLMapElement : propriété areas
Baseline
Large disponibilité
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
La propriété en lecture seule areas de l'interface HTMLMapElement retourne une collection d'éléments HTML <area> associés à l'élément <map>.
Valeur
Un objet HTMLCollection d'éléments HTMLAreaElement.
Exemple
html
<map id="image-map" name="image-map">
<area shape="circle" coords="50,50,35" href="#left" alt="flèche gauche" />
<area shape="circle" coords="150,50,35" href="#right" alt="flèche droite" />
</map>
<img
usemap="#image-map"
src="left-right-arrow.png"
alt="image flèche gauche droite" />
<output></output>
output {
display: block;
}
js
const mapElement = document.getElementById("image-map");
const outputElement = document.querySelector("output");
for (const area of mapElement.areas) {
area.addEventListener("click", (event) => {
outputElement.textContent = `Vous avez cliqué sur la zone ${area.alt}.\n\n`;
});
}
Résultats
[フレーム]
Spécifications
| Spécification |
|---|
| HTML # dom-map-areas-dev |
Compatibilité des navigateurs
Activez JavaScript pour afficher ce tableau de compatibilité des navigateurs.
Voir aussi
- L'interface
HTMLAreaElement - La propriété
HTMLImageElement.useMap
Aider à améliorer MDN
Cette page a été modifiée le par les contributeur·ice·s du MDN.