Dropdown

Defines different styles for a toggleable dropdown.

Table of contents

• Usage

The Dropdown component is aim-aware. This means the dropdown stays open as long as the mouse pointer moves towards the dropdown. An additional delay ensures that the dropdown stays open even if the mouse pointer shortly moves in another direction. A dropdown closes immediately if another menu item is hovered.

Usage

A dropdown is an example of the drop that provides its own styling. Any content, like a button, can toggle a dropdown. Just add the data-uk-dropdown attribute to a block element following the toggle.