twitter-bootstrap
Bootstrap Dropdowns
Suche…
Parameter
| Methoden | Beispiel |
|---|---|
| Über Javascript anrufen | $('.dropdown-toggle').dropdown(); |
| Schaltet das Dropdown um | $('.dropdown-toggle').dropdown('toggle') |
| Ereignistyp | Beschreibung |
| show.bs.dropdown | Dieses Ereignis wird sofort ausgelöst, wenn die Show-Instanzmethode aufgerufen wird. |
| shown.bs.dropdown | Dieses Ereignis wird ausgelöst, wenn die Dropdown-Liste für den Benutzer sichtbar ist (wartet auf CSS-Übergänge, bis der Vorgang abgeschlossen ist). |
| hide.bs.dropdown | Dieses Ereignis wird sofort ausgelöst, wenn die Instanzmethode hide eingeblendet wurde. |
| hidden.bs.dropdown | Dieses Ereignis wird ausgelöst, wenn die Dropdown-Liste für den Benutzer ausgeblendet ist (wartet, bis die CSS-Übergänge abgeschlossen sind). |
| Event-Handler-Beispiel | $(element).on('show.bs.dropdown', function () { // do something… }) |
Bemerkungen
Beim Aufruf von Dropdown über Javascript $('.dropdown-toggle').dropdown() ist das data-api dh data-toggle="dropdown" noch erforderlich. Weiterlesen
Wie benutzt man
Verwenden Sie die .dropdown Klasse für das übergeordnete Element des Dropdown-Menüs.
Fügen Sie einem Element die Dropdown-Menüklasse hinzu, um das Plugin für das Dropdown-Menü zu initialisieren.
Rufen Sie das Plugin mit der Klasse .dropdown-toggle und dem Attribut data-toggle="dropdown" für eine Schaltfläche oder einen Hyperlink auf.
Basisbeispiel
<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
Lizenziert unter CC BY-SA 3.0
Nicht angeschlossen an Stack Overflow