Dropdown
A dropdown is an HTML component that allows the user to choose one value from a list. It is similar to the select box.
Bootstrap Dropdown
Dropdown is toggleable, contextual overlay for displaying lists of links and more. It is made interactive with the included Bootstrap dropdown JavaScript plugin.
Propeller Dropdown
Propeller Dropdown consists of Bootstrap HTML structure with Propeller customized classes based on material design standards.
Types - Based on the type of content, Propeller Dropdown can be categorized into three types: with header, with divider, and with disabled links.
Dropdown with Directions
Dropdown can start from different directions such as from bottom left, bottom right, top left, top right. Add .dropdown-menu-right to make the dropdown open from bottom-right, .pmd-dropdown-menu-top-left to make the dropdown open from top-left and .pmd-dropdown-menu-top-right to make the dropdown open from top-right.
Bottom Left Direction
Bottom Right Direction
Top Left Direction
Top Right Direction
Dropdown with Hover event
In this case, we are showing the dropdown on the hover of a particular button. In order to open the dropdown on hover, add .pmd-dropdown-hover to the button.
Hover with header
Hover with divider
Hover with disabled menu items