Popover
Comportement fonctionnel attendu
- Lorsque le bouton est cliqué, l'info-bulle apparaît et le focus est déposé sur le bouton de fermeture;
- L'utilisateur doit soit cliquer sur le bouton de fermeture ou appuyer sur la touche Échap afin de fermer l'info-bulle;
- Les utilisateurs pouvant naviguer avec la souris peuvent fermer l'info-bulle en cliquant n'importe où en dehors de la boîte d'info-bulle.
Composant popover accessible en action
Hyperlien avant le bouton.
Hyperlien après le bouton.
Raccourcis clavier
Touche |
Fonction |
Échap |
Ferme le popover |
Rôle ARIA, propriétés et états
Rôle |
Attribut |
Élément |
Utilisation |
tooltip |
|
<div> |
Sert de conteneur pour afficher le contenu contextuel. |
|
aria-expanded |
<button> |
Permet d'annoncer l'état Plié / Déplié |
|
aria-describedby |
<button> |
Établie la relation entre le bouton et le contenu du popover. |
|
aria-controls |
<button> |
Définie la relation avec l'élément auquel le composant interagi. |
|
aria-hidden |
<div> |
Permet de cacher ou afficher du contenu au lecteur d'écran. |
|
tabindex="-1" |
<div> |
Permet de déposer le focus sur la fenêtre modale par programmation. |
Retourner à l'index