twitter-bootstrap
Bootstrap Dropdowns
Sök…
parametrar
| metoder | Exempel |
|---|---|
| Ring via Javascript | $('.dropdown-toggle').dropdown(); |
| Växlar rullgardinsmenyn | $('.dropdown-toggle').dropdown('toggle') |
| Event typ | Beskrivning |
| show.bs.dropdown | Den här händelsen startas omedelbart när show-instansmetoden anropas. |
| shown.bs.dropdown | Den här händelsen avfyras när rullgardinsmenyn har blivit synlig för användaren (väntar på att CSS-övergångar ska slutföras). |
| hide.bs.dropdown | Denna händelse avfyras omedelbart när döljinstansmetoden har kallats. |
| hidden.bs.dropdown | Den här händelsen avfyras när rullgardinsmen är klar döljs för användaren (väntar på att CSS-övergångar ska slutföras). |
| Exempel på evenemangshanterare | $(element).on('show.bs.dropdown', function () { // do something… }) |
Anmärkningar
När du ringer Dropdown via Javascript $('.dropdown-toggle').dropdown() krävs fortfarande data-api dvs. data-toggle="dropdown" . Läs mer
Hur man använder
Använd .dropdown klass på moderelementet i rullgardinsmenyn.
Lägg till .dropdown-menyklassen i ett element för att initialisera dropdown-menyplugin.
Ring plugin genom att använda klass .dropdown-toggle och attributet data-toggle="dropdown" på en knapp eller en Hyperlink.
Grundläggande exempel
<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
Licensierat under CC BY-SA 3.0
Inte anslutet till Stack Overflow