Dropnav

Dropdown

Dropbar

JavaScript Options

Option Value Default Description
align String left Drop alignment (left, right, center).
boundary Boolean, CSS selector true Referenced element to keep Drop's visibility. By default, it's the dropnav component's element.
dropbar Boolean, CSS selector false The dropbar selector. If true the dropbar will be inserted automatically.
dropbar-anchor Boolean, CSS selector false The dropbar anchor selector. If set, dropbar will be inserted after the anchor element.
duration Number 200 The dropbar transition duration.
container Boolean false Define a target container via a selector to specify where the drops should be appended in the DOM.
stretch Boolean, String true Stretch drop on both (true) or given axis (x,y).
mode String click,hover Comma-separated list of drop trigger behavior modes (hover, click).
delay-show Number 0 Delay time in hover mode before a drop is shown in ms.
delay-hide Number 800 Delay time in hover mode before a drop is hidden in ms.
target Boolean, CSS selector false The element the drop is positioned to (`true` for window).
target-x Boolean, CSS selector false The element's X axis the drop is positioned to (`true` for window).
target-y Boolean, CSS selector false The element's Y axis the drop is positioned to (`true` for window).
offset Number 0 The drop offset.
animation String uk-animation-fade Space-separated names of animations. Comma-separated for animation out.
animate-out Boolean false Use animation when closing the drop.
bg-scroll Boolean true Allow background scrolling while drop is opened.
close-on-scroll Boolean false Closes the drop on scrolling a parent scroll container.