MODAL NOTIFICATION
MODAL TYPE LIGHTBOX IMAGE
MODAL TYPE LIGHTBOX VIDEO MP4
MODAL TYPE LIGHTBOX VIDEO YOUTUBE
MODAL TYPE LIGHTBOX VIDEO VIMEO
MODAL TYPE LIGHTBOX MAPS
MODAL TYPE LIGHTBOX ANCHOR
How to add it with data-control-target:
Each mode is placed as a value inside data-control-target. General format examples: data-control-target="exit-window=never" data-control-target="click=.trigger" data-control-target="time-inside=5min && session" This attribute accepts one rule or multiple combined with &&.
exit-window
Controls when the modal appears as the user intends to leave the page.
Allowed values:
exit-window=never
exit-window=always
exit-window=3days
exit-window=session
click
Activates the modal when the user clicks certain elements.
Allowed values:
click=.class && never
click=#id && always
click=.button && 3days
click=.button && session
time-inside
Triggers the modal after the user has been inside the page for a certain amount of time.
Options:
time-inside=5sec && never
time-inside=5min && always
time-inside=5hour && 3days
time-inside=10sec && session
time-inactive
Triggers the modal when the user has been inactive for the defined amount of time.
Options:
time-inactive=5sec && never
time-inactive=30sec && always
time-inactive=1min && 3days
time-inactive=10sec && session
click-mouse-number
Triggers the modal after the user performs a certain number of clicks on the page.
Options:
click-mouse-number=5 && never
click-mouse-number=3 && always
click-mouse-number=10 && 3days
click-mouse-number=7 && session
view-pages-number
Triggers the modal once the user has visited a certain number of internal pages.
Options:
view-pages-number=5 && never
view-pages-number=3 && always
view-pages-number=10 && 3days
view-pages-number=4 && session
scroll-distance
Triggers the modal after the user scrolls a specific distance.
Options: br
scroll-distance=50px && never
scroll-distance=150px && always
scroll-distance=300px && 3days
scroll-distance=100px && session
scroll-element-view
Triggers the modal when a specific element becomes visible in the viewport.
Options:
scroll-element-view=.my-element && never
scroll-element-view=.my-element && always
scroll-element-view=.my-element && 3days
scroll-element-view=.my-element && session
Version 1.4.1 is now available
Includes the all new dashboard view. Pages and exports will now load faster.