Popover
Sobreposição de conteúdo rico acionada por clique ou hover. Diferente do Tooltip (hover, apenas texto), o Popover comporta formulários, menus e conteúdo interativo com posicionamento configurável e um indicador de seta opcional. Suporta 8 posições, botão de fechar, cabeçalho com título e modos de acionamento por clique e hover.
Pré-visualização e Código
_popover.html.erb
███ ███████ █████████
█████████
██████████ ██████ █ ███████ ██████████ █████ ██████ ███████ ███████████ █████████ ██████████████ ███████████
██████ ███████ █ ████ █████████
████████ ██████ █ ██████ ██████████ ██████
███████ ███████ █ █ █████████ █ ████████ ████ ███████ ██ ██████
██████ ██████ █ ███ █████████ █ ████████ ██████ █████
████████████ ███████ █ ████ █████████ █ ████ █████ ██████
██████ ██████ █ ██████████ ███ ███████ ███ ███ █████████
██████ ███ ███████ ███████ ████████ ███████ ████ ███████ ████ ███████
popover_controller.js
██████ █ ██████████ █ ████ ████████████████████
██ ████████ ██ █████████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ ████████
██████ ██████ █ █
█████ █ █████ ████████ ████████ █████ ██
████████████ █ █████ ███████ ████████ ███████ ██
████████████ █ █████ ████████ ████████ ████ █
█
popover_component.html.erb
████ █████████████████████████
████████████████████████████████████ █████████████ ███
███████████████████████████████████ ████████████ ███
██████████████████████████████████████████████████████ ██████████████████████████████████████
███████████████ ████████████ ███ ██████████████ ████
███ ███████ ██
████ █████████████████████████████
████████████████ ██████████████ ████
██ ██ ████████ ██
popover_component.rb
█ ██████████████████████ ████
█████ ████████████████ █ ███████████████████
██████████ █ █
████ ████████████ ████████ ████████████████ ██████
███████ █████████ ████████ ████████████████ ██████
█████ ███████████ ███████ ████████████████ ██████
██████ ██████████ ███████ ████████████████ ██████
██████████ ████████████ ██████ ██████
████████ ████████████ ███████ ██████
popover_controller.js
██████ █ ██████████ █ ████ ████████████████████
██ ████████ ██ █████████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ███████████ ████████
██████ ██████ █ █
█████ █ █████ ████████ ████████ █████ ██
████████████ █ █████ ███████ ████████ ███████ ██
████████████ █ █████ ████████ ████████ ████ █
█
Changelog
- v1.0.0: Initial release with placement, arrow, trigger mode, title, and dismissible options
Obter Acesso Completo
Desbloqueie o código-fonte deste componente e de todos os outros. Pagamento único para acesso vitalício.
Obter Acesso Agora