Come faccio a fare in modo che il menu a discesa di twitter bootstrap sia posizionato al passaggio del mouse anziché un clic?Come rendere il dropdown di Bootstrap su hover?
risposta
Mentre il How to make twitter bootstrap menu dropdown on hover rather than click è stato aumentato molto, con le versioni più recenti di Bootstrap, non c'è bisogno di hackerarlo.
http://cameronspear.com/blog/twitter-bootstrap-dropdown-on-hover-plugin/ è un sostituto per il dropdown.js esistente e consente di attivare al passaggio del mouse. Non sono richieste modifiche CSS.
heres una funzione che sto usando per ottenere menu di scorrimento barra di navigazione per scorrere verso il basso al passaggio del mouse invece di popping in
$('.navbar .dropdown').hover(function() {
$(this).find('.dropdown-menu').first().stop(true, true).delay(250).slideDown();
}, function() {
$(this).find('.dropdown-menu').first().stop(true, true).delay(100).slideUp()
});
1.Hide discesa menu su mouseover.
$(document).ready(function() {
$('.nav li.dropdown').hover(function() {
$(this).addClass('open');
}, function() {
$(this).removeClass('open');
});
});
2.Hide discesa menu su click.
$(document).ready(function() {
$('.nav li.dropdown').hover(function() {
$(this).addClass('open');
});
});
aggiungere anche '$ ('nav li.dropdown'). RemoveClass ('apri'); 'come prima riga nella seconda (chiusura), in modo che se si hanno più elenchi a discesa, si nascondano gli altri che possono essere aperti. –
- 1. Bootstrap Collapse fisarmonica su hover
- 2. Pulsante Bootstrap/Dropdown
- 3. Bootstrap su Twitter, pulsanti hover style?
- 4. Tooltip di Bootstrap su Twitter su Hover & Focus
- 5. Bootstrap .dropdown li colore di sfondo
- 6. Come rendere l'intero div cambia colore su hover usando css?
- 7. Menu BootStrap TopBar e DropDown di Twitter
- 8. Come rendere jQuery 1.7 .on() hover?
- 9. Come rendere il pulsante Dropdown che cambia il suo titolo ha diversi link?
- 10. Twiiter Bootstrap - modulo dropdown divisori e intestazioni
- 11. Come rendere Bootstrap più "compatto"
- 12. Come rendere Bootstrap "Cards" Responsive
- 13. Come rendere attivo il tab bootstrap 3 nav di default?
- 14. a: hover non funziona, con bootstrap
- 15. aggiungi checkbox nel dropdown di bootstrap di twitter
- 16. Dropdown del pulsante di divisione di Navbar con Bootstrap 3
- 17. I dropdown nidificati si materializzano
- 18. Perché questo esempio di dropdown del bootstrap non funziona?
- 19. cambiamento di layout su hover
- 20. Comportamento anomalo del dropdown del bootstrap in Firefox
- 21. dropdown input inputdown keyboard arrow
- 22. Come rimuovere il contenitore a discesa del bootstrap?
- 23. Come rendere il suggerimento jQueryUI solo su fuoco
- 24. jQuery sostituisce il testo dell'elemento su hover
- 25. Come rendere display: flex work per la reattività - Bootstrap?
- 26. dropdown di Twitter splitdowndown
- 27. Div sovrapposte su: hover
- 28. Disabilita hover su Highcharts
- 29. Come utilizzare il tooltip di bootstrap?
- 30. Come posso rendere l'icona piccola quando si utilizza il bootstrap?
Si può fare questo semplice css pura usando, http://stackoverflow.com/a/22365311/861607 –