Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
HTMLElement : méthode showPopover()
Baseline
2024
*
Newly available
Depuis April 2024, cette fonctionnalité fonctionne sur les appareils et les versions de navigateur les plus récents. Elle peut ne pas fonctionner sur les appareils ou navigateurs plus anciens.
* Certaines parties de cette fonctionnalité peuvent bénéficier de prise en charge variables.
La méthode showPopover() de l'interface HTMLElement affiche un élément popover (c'est-à-dire un élément qui a un attribut popover valide) en l'ajoutant à la couche supérieure.
Lorsque showPopover() est appelée sur un élément avec l'attribut popover qui est actuellement masqué :
- Un évènement
beforetoggleest déclenché. - Le popover est affiché.
- L'évènement
toggleest déclenché.
Si l'élément est déjà visible, une erreur est lancée.
Syntaxe
showPopover()
Paramètres
Aucun.
Valeur de retour
Aucune (undefined).
Exceptions
InvalidStateErrorDOMException-
Lancée si le popover est déjà affiché.
Exemples
L'exemple suivant définit un comportement pour afficher un popover en appuyant sur une touche particulière du clavier.
HTML
<button popovertarget="mypopover">Basculer l'affichage du popover</button>
<p>
Vous pouvez appuyer sur la touche <kbd>h</kbd> de votre clavier pour afficher
le popover.
</p>
<div id="mypopover" popover="manual">Coucou</div>
JavaScript
const popover = document.getElementById("mypopover");
document.addEventListener("keydown", (event) => {
if (event.key === "h") {
popover.showPopover();
}
});
Résultat
Spécifications
| Specification |
|---|
| HTML # dom-showpopover |
Compatibilité des navigateurs
Chargement...