Menus

nsPopover could be used as a simple dropdown menu. You can use the built-in ns-popover-list-theme to style the popover as a dropdown or create a custom one.

Hover me

Tooltip

nsPopover could be used as a simple tooltip. You can use the built-in ns-popover-tooltip-theme to style the popover as a dropdown or create a custom one.

Hover me

Hide on click

nsPopover hide when it is clicked by default, but this behavior could be changed by set the ns-popover-hide-on-click property to false. The popover above is closed only when the Close button is clicked.

Modal

nsPopover hide other popover instances when the current one is open. Can be optionally grouped.

Hover me Hover me (Group) Hover me (Group)

Track mouse position

nsPopover could be displayed at the same point the mouse is positioned, which could be used to create popver that acts as a context menu. To enabled this feature you just need to specify ns-popover-mouse-relative property to the axis to be tracked. The popover above is displayed at the same x and y position of the mouse, when clicked.

Click anywhere inside me

Delay popup

nsPopover can create a delay on the popup element.

Click and wait

Disable/Enable Popover

Hover me