Dropdown

Defines different styles for a toggleable dropdown.

FrankenstyleKit (aka Franken UI 3.0) is now available. Support for the current version will gradually wind down. It will continue to work, but using the latest version is recommended for new projects so you can benefit from future updates and enhancements.

Table of contents

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.

Customize

Customize your Franken UI experience.