Popover
Superposition de contenu riche déclenchée par clic ou survol. Contrairement au Tooltip (survol, texte uniquement), le Popover contient des formulaires, menus et du contenu interactif avec un positionnement configurable et un indicateur fléché optionnel. Prend en charge 8 positions, un bouton de fermeture, un en-tête de titre et les modes de déclenchement par clic et survol.
Aperçu et code
_popover.html.erb
███ ███████ █████████
█████████
██████████ ██████ █ ███████ ██████████ █████ ██████ ███████ ███████████ █████████ ██████████████ ███████████
██████ ███████ █ ████ █████████
████████ ██████ █ ██████ ██████████ ██████
███████ ███████ █ █ █████████ █ ████████ ████ ███████ ██ ██████
██████ ██████ █ ███ █████████ █ ████████ ██████ █████
████████████ ███████ █ ████ █████████ █ ████ █████ ██████
██████ ██████ █ ██████████ ███ ███████ ███ ███ █████████
██████ ███ ███████ ███████ ████████ ███████ ████ ███████ ████ ███████
popover_controller.js
██████ █ ██████████ █ ████ ████████████████████
██ ████████ ██ █████████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ ████████
██████ ██████ █ █
█████ █ █████ ████████ ████████ █████ ██
████████████ █ █████ ███████ ████████ ███████ ██
████████████ █ █████ ████████ ████████ ████ █
█
popover_component.html.erb
████ █████████████████████████
████████████████████████████████████ █████████████ ███
███████████████████████████████████ ████████████ ███
██████████████████████████████████████████████████████ ██████████████████████████████████████
███████████████ ████████████ ███ ██████████████ ████
███ ███████ ██
████ █████████████████████████████
████████████████ ██████████████ ████
██ ██ ████████ ██
popover_component.rb
█ ██████████████████████ ████
█████ ████████████████ █ ███████████████████
██████████ █ █
████ ████████████ ████████ ████████████████ ██████
███████ █████████ ████████ ████████████████ ██████
█████ ███████████ ███████ ████████████████ ██████
██████ ██████████ ███████ ████████████████ ██████
██████████ ████████████ ██████ ██████
████████ ████████████ ███████ ██████
popover_controller.js
██████ █ ██████████ █ ████ ████████████████████
██ ████████ ██ █████████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ ████████
██████ ██████ █ █
█████ █ █████ ████████ ████████ █████ ██
████████████ █ █████ ███████ ████████ ███████ ██
████████████ █ █████ ████████ ████████ ████ █
█
Journal des modifications
- v1.0.0: Initial release with placement, arrow, trigger mode, title, and dismissible options
Obtenir l'accès complet
Débloquez le code source de ce composant et de tous les autres. Paiement unique pour un accès à vie.
Obtenir l'accès maintenant