11.4 #Objects.flyout Flyout
Flyouts are pieces of content that fly out of a parent when said parent is hovered.
Examples
Default styling
Hover over me to see content below
Flying Hello World
.duk-flyout--left
Fylout leff
Hover over me to see content below
Flying Hello World
.duk-flyout--right
Flyout right
Hover over me to see content below
Flying Hello World
Markup
<div style="max-width: 500px">
<div class="duk-flyout [modifier class]">
Hover over me to see content below
<div class="duk-flyout__content duk-island--primary">
<p>Flying Hello World</p>
</div>
</div>
</div>
Source:
scss/objects/_flyout.scss, line 4