Pull to refresh

Bootstrap Dropdown Menus Enhancement

Reading time1 min
Views43K
Мне очень нравятся выпадающие меню из Bootstrap. Благодаря простой и понятной семантике их легко и приятно использовать при верстке.

Но для полного счастья мне не хватало некоторой функциональности.


1. radio и checkbox


В сети существует великое множество плагинов для стилизации select и select multiple, но мне хотелось что-то простое и универсальное, и раз уж я использую «Bootsrap Dropdown Menus» в своем проекте, то почему бы с минимальными усилиями не заставить их выполнять эту задачу. Что и было сделано.

2. позиционирование


Иногда требуется расположить меню выше кнопки или по центру. Для этого помимо стандартного .pull-right были внедрены новые классы .pull-top, .pull-center, .pull-middle.

3. bullet


Класс .bullet добавляет стрелочку к меню.





Буду рад любым комментариям, замечаниям, дополнениям. Спасибо за внимание.

PS: Страница на GitHub оформлена на английском языке. Я не очень силен в английском, поэтому буду рад любой помощи в исправлении неточностей и ошибок.

UPD Добавлено закрытие меню при щелчке по радио-кнопке… Добавлена возможность оставлять меню открытым, для этого нужно добавить класс .noclose к dropdown-menu (см. демо).
Only registered users can participate in poll. Log in, please.
Следует ли закрывать меню при выборе радио кнопки?
47.89% Да295
13.47% Нет83
38.64% Сделать опцию238
616 users voted. 169 users abstained.
Tags:
Hubs:
If this publication inspired you and you want to support the author, do not hesitate to click on the button
+43
Comments14

Articles