twitter-bootstrap
Bootstrap Dropdowns
Recherche…
Paramètres
| Les méthodes | Exemple |
|---|---|
| Appelez via Javascript | $('.dropdown-toggle').dropdown(); |
| Bascule la liste déroulante | $('.dropdown-toggle').dropdown('toggle') |
| Type d'événement | La description |
| show.bs.dropdown | Cet événement se déclenche immédiatement lorsque la méthode d'instance show est appelée. |
| affiché.bs.dropdown | Cet événement est déclenché lorsque l'utilisateur a rendu visible la liste déroulante (attendra que les transitions CSS soient terminées). |
| hide.bs.dropdown | Cet événement est déclenché immédiatement lorsque la méthode d'instance hide a été appelée. |
| hidden.bs.dropdown | Cet événement est déclenché lorsque la liste déroulante a été masquée par l'utilisateur (attendra la fin des transitions CSS). |
| Exemple de gestionnaire d'événement | $(element).on('show.bs.dropdown', function () { // do something… }) |
Remarques
Lorsque vous appelez Dropdown via Javascript $('.dropdown-toggle').dropdown() Dropdown $('.dropdown-toggle').dropdown() Dropdown $('.dropdown-toggle').dropdown() , le data-api ie data-toggle="dropdown" toujours requis. Lire la suite
Comment utiliser
Utilisez la classe .dropdown sur l'élément parent du menu déroulant.
Ajoutez la classe .dropdown-menu à un élément pour initialiser le plug-in du menu déroulant.
Appelez le plug-in en utilisant la classe .dropdown-toggle et l'attribut data-toggle="dropdown" sur un bouton ou un lien hypertexte.
Exemple de base
<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
Sous licence CC BY-SA 3.0
Non affilié à Stack Overflow