Demo 2 – Introduction
- Below you find a yellow-ish section with a list of Popup triggers. Each trigger displays the ID of the Popup that is opened.
- Inspect the Popups below to see how they are created.
Triggers
Basic Popup
Popup without close button
Modal Popup with alternative close button
Inverted close button color (for dark backgrounds)
#popup-5
No button trigger. This Popup is displyed on exit-intent.
Popup 1
This is the most basic Popup variant.
The section only has the CSS ID «popup-1» and the CSS Class «popup«
Popup 2
This Popup has no close button.
Close it by clicking on the background or pressing ESC.
The section has the CSS ID «popup-2» and the CSS Class «popup no-close«
Popup 3
This Popup has an alternate close button and is modal.
Background clicks are ignored.
Close it via ESC or the close button.
The section has the CSS ID «popup-3» and the CSS Class «popup close-alt is-modal«
Popup 4
This Popup has an inverted close button color, for dark backgrounds.
The section has the CSS ID «popup-4» and the CSS Class «popup dark«
Popup 5
This Popup is displayed, because an exit-intent was detected.
The section has the CSS ID «popup-5» and the CSS Class «popup on-exit«