twitter-bootstrap
Выпадающие окна Bootstrap
Поиск…
параметры
методы | пример |
---|---|
Вызов через Javascript | $('.dropdown-toggle').dropdown(); |
Переключает выпадающий список | $('.dropdown-toggle').dropdown('toggle') |
Тип события | Описание |
show.bs.dropdown | Это событие срабатывает сразу же после вызова метода show instance. |
shown.bs.dropdown | Это событие запускается, когда выпадающее окно становится видимым для пользователя (будет ждать перехода CSS для завершения). |
hide.bs.dropdown | Это событие запускается сразу же после вызова метода экземпляра hide. |
hidden.bs.dropdown | Это событие запускается, когда выпадающий список скрывается от пользователя (будет ждать перехода CSS для завершения). |
Пример обработчика событий | $(element).on('show.bs.dropdown', function () { // do something… }) |
замечания
При вызове Dropdown через Javascript $('.dropdown-toggle').dropdown()
Dropdown $('.dropdown-toggle').dropdown()
Dropdown $('.dropdown-toggle').dropdown()
все равно требуется data-api, т.е. data-toggle="dropdown"
. Прочитайте больше
Как пользоваться
Используйте класс .dropdown
в родительском элементе выпадающего меню.
Добавьте класс .dropdown-menu в элемент для инициализации плагина выпадающего меню.
Вызовите плагин, используя класс .dropdown-toggle
и атрибут data-toggle="dropdown"
на кнопке или гиперссылке.
Основной пример
<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
Лицензировано согласно CC BY-SA 3.0
Не связан с Stack Overflow