Popper.js permet de créer très facilement des infobulles, avec l’aide de javascript, dans vos page web. La gestion d’infobulle, selon l’auteur du site Popper.js, peut s’avérer difficile à mettre en oeuvre. C’est pour cette raison qu’il a créé Popper.js, qui devrait devenir votre nouveau meilleur ami!
Popper.js est livré avec un ensemble d’options pour répondre à tous vos besoins. Et, si vous n’aviez pas entière satisfaction, Popper.js supporte les plugins pour étendre ses fonctionnalités. Ce système est appelé « Modifiers ».
Principales caractéristique des infobulles Popper.js :
- Placements : Vous décidez où l’infobulle va s’afficher, entre les quatre côtés de votre élément de référence et vous choisissez le décalage sur le début ou à la fin de celui-ci.
- Limites personnalisées : Impossible de perdre vos infobulles! Donnez-leur quelques limites pour vous assurer qu’ils resteront là où vous l’avez décidé.
- Retourner et Déplacer : Que faire si votre infobulle atteint les limite de la page? Disparaitre, changer côté, etc. ? C’est à vous de décider.
- Flèches : Les infobulles ont en générale des flèches. Un soin particulier a été apporté à cet aspect et l’auteur fait en sorte que les flèches restent à la bonne place: entre l’infobulle et élément de référence.
- Fixe ou absolue? : Il existe une détection automatiquement lorsque votre infobulle doit être en position « fixe » ou « absolue ».
- Accélération GPU : Si l’accélération GPU est prise en charge par votre navigateur, les infobulles seront positionnées en utilisant le CSS translate3d, ce qui affiche vos infobulles encore plus rapidement.
- Décalages : Lorsque vous avez besoin de précision chirurgicale sur la position de votre infobulle, définissez un décalage au pixel.
- « Modifiers » : Ce système de plugin vous permet d’ajouter tout type de fonctionnalité pour Popper.js. La plupart des comportements intégrés sont écrits en tant que « modifiers ».
Enfin, Popper.js, c’est approximativement 3,5 kb minifiés et gzippés, et sans aucune dépendance!
Site Internet : Popper.js
Licence : MIT