twitter-bootstrap
Bootstrap Dropdowns
Buscar..
Parámetros
| Métodos | Ejemplo |
|---|---|
| Llamar a través de Javascript | $('.dropdown-toggle').dropdown(); |
| Alterna el menú desplegable | $('.dropdown-toggle').dropdown('toggle') |
| Tipo de evento | Descripción |
| show.bs.dropdown | Este evento se dispara inmediatamente cuando se llama al método de instancia de show. |
| shown.bs.downdown | Este evento se activa cuando el menú desplegable se ha hecho visible para el usuario (esperará a que se completen las transiciones de CSS). |
| hide.bs.dropdown | Este evento se activa inmediatamente cuando se llama al método de instancia de ocultación. |
| hidden.bs.dropdown | Este evento se activa cuando el menú desplegable ha terminado de ocultarse al usuario (esperará a que se completen las transiciones de CSS). |
| Ejemplo de controlador de eventos | $(element).on('show.bs.dropdown', function () { // do something… }) |
Observaciones
Cuando se llama a Dropdown Via Javascript $('.dropdown-toggle').dropdown() , el data-api es decir, data-toggle="dropdown" aún es necesario. Lee mas
Cómo utilizar
Utilice la clase .dropdown en el elemento principal del menú desplegable.
Agregue la clase .dropdown-menu a un elemento para inicializar el complemento del menú desplegable.
Llame al complemento utilizando la clase .dropdown-toggle y el atributo data-toggle="dropdown" en un botón o un hipervínculo.
Ejemplo básico
<div class="dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example
<span class="caret"></span></button>
<ul class="dropdown-menu">
<li><a href="#">Option One</a></li>
<li><a href="#">Option two</a></li>
<li><a href="#">More Options</a></li>
</ul>
</div>
Modified text is an extract of the original Stack Overflow Documentation
Licenciado bajo CC BY-SA 3.0
No afiliado a Stack Overflow