Outils HTML et accessibilité

Gratuit Generateur de popover interest invoker

Generez du HTML declaratif avec interestfor pour des popovers declenchees au survol et au focus sans JavaScript.

Chargement de l'outil...

Qu'est-ce que Generateur de popover interest invoker ?

La commande interestfor (Chrome 142+) ouvre un popover au survol ou au focus sans JavaScript. Utilisez commandfor='id' et command='interestfor' sur un bouton, popover='hint' sur la cible. Remplace les gestionnaires mouseenter/mouseleave manuels.

Réponse rapide

Popover au survol/focus avec commandfor et command='interestfor' sans JavaScript. Chrome 142+.

Last updated: 2026-06-03

Limites

  • Chrome 142+ uniquement. Pas de polyfill.
  • Pas de contenu interactif dans le popover.
  • La cible doit etre dans le DOM au chargement.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

Comment utiliser cet outil

  1. Creez un popover avec popover='hint'.
  2. Ajoutez un bouton avec commandfor et command='interestfor'.
  3. Ajoutez CSS pour le survol et le positionnement.
  4. Testez au survol et au focus clavier.

A quoi il sert

  • Infobulles accessibles sans JavaScript.
  • Apercus au survol pour les produits.
  • Menus au survol declaratifs.

Cas d'usage

Exemples concrets

Exemple

Infobulle accessible

Bouton avec commandfor='info-tip' ouvre le popover au survol ET au focus clavier.

Exemple

Apercu produit au survol

Popover avec image, prix et bouton ajout au panier au survol.

Erreurs frequentes

  • Oublier popover='hint' (popover='auto' ferme au clic exterieur).
  • Contenu interactif dans un popover interestfor.
  • Pas de style visible au survol/focus.

Vérification

  1. Survolez le bouton dans Chrome 142+, verifiez l'ouverture/fermeture.
  2. Tabulez au clavier, verifiez l'ouverture au focus.

FAQ

Questions sur Generateur de popover interest invoker

Difference avec togglePopover?

interestfor ouvre au survol/focus, ferme en s'eloignant. togglePopover ouvre/ferme au clic.

Fonctionne au clavier?

Oui, interestfor repond au focus clavier automatiquement.

Delai d'ouverture?

Oui, avec interesttarget-delay en CSS : 300ms pour eviter les ouvertures accidentelles.

Outils lies

Autres outils outils html et accessibilité

A essayer aussi

A essayer aussi

Outils CSS et design

Générateur de carrousel CSS

Générez le balisage d’un carrousel CSS natif avec scroll-snap, boutons de défilement, repères de défilement et structure de liste accessible. Aucun JavaScript requis.

Ouvrir l'outil