A popover is like a pop-up box that appears when the user clicks on an element, providing additional information.

There are 2 parts to a Popover element:

  1. The trigger element

  2. The pop-up element

Insert the trigger element where it says “Drop element here”.

To edit the content in the popout menu, click the “change view mode” button. Then drop elements into the white box below.


Trigger: Define how the popover will be triggered.

  • Click: Open when user clicks on the trigger element.

  • Hover: Open when user hovers over the trigger element.

  • Contextmenu: Open when a user right clicks.

  • Event: Open when another element prompts it to through an interaction.

Placement: Where the popover will appear, relative to the trigger element.

Disabled: When on, the popover will be disabled and cannot be triggered.

Show arrow: When on, the arrow on the popover box will appear.

Arrow background: Choose color for the arrow.

ShowAfter time: Delay of appearance in milliseconds.

HideAfter time: Delay of disappearance in milliseconds.

AutoClose time: Timeout to hide tooltip in milliseconds.

See Tooltip for tooltip configurations.

Supported Events

No supported events.

Supported Actions

Set Visible: Open popover.

Set Data: Change element data. See Data Store.

Set Loading: Set loading animation. See Set loading animations.

Visit Interactions for more on events and actions.

Last updated