A flyout is pop-up menu that branches off another visual element. Flyouts are used as elements that reveal "on hover" or "on tap" (mobile) content.
dit is een tooltip met extra info, deze verschijnt enkel on hover & click
<div class="c-flyout js-flyout ">
<div class="c-flyout__trigger ">
<span class='fas fa-info-circle'></span>
</div>
<div class="c-flyout__content">
<p>dit is een tooltip met extra info, deze verschijnt enkel on hover
& click</p>
</div>
</div>
is-open
Indicates that the content of the flyout is displayed, this is only usable when on mobile devices because on desktop a hover is used to display the content.
js-flyout
Indicates that the flyout component is using JavaScript for its interactivity. Remove this class if the JavaScript defined in the brandplatform is no longer necessary.