Topincs Reference
Logout
HTML custom componentA-ZOngoing

pop-up

Description

A pop up is initially hidden and is shown on demand. How the popup appears can be controlled with the origin attribute.

Language: English

HTML structure

[%<pop-up id="some-popup" origin="top"> </pop-up>%]

Comments

Showing the component needs an opener (an icon or button) which sets the shown attribute. [%var icon = document.getElementById("some-icon"); icon.addEventListener("click", function() { document.getElementById("some-popup").shown = 1; }); %] Any click or touch outside the popup hides the popup.

Attributes

Coding name origin
Mandatory0
DescriptionControls the appearance behavior of the pop up.
Value space* %center%: the popup appears in the center of the window (default) * %top%: the popup slides in from the top * %left%: the popup slides in from the left * %bottom%: the popup slides in from the bottom * %right%: the popup slides in from the right * %element%: pass an element or selector to show
Default valueBy default the pop up appears in the center.

We are sorry

This page cannot be displayed in your browser. Use Firefox, Opera, Safari, or Chrome instead.

   

Before we continue …