Docs / Ele Conditions / Triggers

Triggers & Actions

Attach interactive behaviors to any widget or section — no JavaScript required. Each trigger row defines one event that fires an action on a target element.

How it works

Each row in the Triggers repeater defines one Trigger → Action pair:

Trigger — the event or condition that causes the action to fire
Action — what happens when the trigger fires (see Actions reference)
Target — which element is affected (defaults to the element itself, but accepts any CSS selector)

You can add multiple rows to the same element — for example: a button that hides itself (click → hide, target: self) and shows a modal (click → show, target: #my-modal).

Hide initially

The Hide initially switch hides the element as soon as the page loads, before any trigger fires. Use it with a show or toggle action to create reveal effects.

TIP

Hide initially works even with no trigger rows defined — useful for hiding elements revealed by a trigger on a different element via CSS selector.

Click

Fires when the visitor clicks the element. No additional settings required.

Common uses: toggle dropdowns or accordion items, show/hide modals, add a CSS class on click.

Hover (mouse enter)

Fires when the visitor's cursor enters the element. No additional settings required.

INFO

Fires on mouse enter only — not on mouse leave. To reverse the action on leave, add a second trigger row for hover with the opposite action.

Delay on load

Fires a set number of milliseconds after the page finishes loading.

Field	Description	Default
Delay (ms)	Milliseconds to wait before the action fires	1000

Delay	Use case
`2000`	Show a promotional banner 2 seconds after load
`5000`	Reveal a cookie notice after 5 seconds
`30000`	Display an upsell after 30 seconds on page

Scroll into view

Fires once when the element scrolls into the visible viewport area. The trigger fires only on the first appearance — scrolling the element out and back does not re-fire it.

Common uses: animate an element the first time it appears on screen, start a counter animation, reveal content as the user reads down.

INFO

Uses the browser's IntersectionObserver API — supported in all modern browsers. Silently ignored in older browsers.

Time on page

Fires after the visitor has spent a set number of seconds on the page.

Field	Description	Default
Seconds on page	How long to wait before the action fires	10

Common uses: show a "Still reading?" prompt after 60 seconds, display a lead capture form after 30 seconds, trigger a chat widget after 20 seconds.

Exit intent

Fires when the visitor's cursor moves out of the page toward the browser's address bar — a strong signal they are about to leave. Fires once per page load.

Common uses: last-chance offer popup, newsletter signup, "Wait, before you go…" message.

INFO

Detected via mouse position — works reliably on desktop. Does not fire on mobile (touch) devices.

First visit

Fires only the first time a visitor loads this page on their device. Visit counts are tracked per page URL using localStorage.

Common uses: welcome message for new visitors, one-time tutorial overlay, first-visit discount banner.

Nth visit

Fires on exactly the Nth page load by the same visitor.

Field	Description	Default
Visit number	Which page load number triggers the action	2

Visit number	Use case
`3`	Show a "regular visitor" offer on the 3rd visit
`5`	Ask for a review or feedback on the 5th visit
`10`	Reward a loyal visitor with a special message

A/B test

Randomly assigns each visitor to Group A or Group B and fires based on their group. The assignment is stored permanently in localStorage — the visitor stays in the same group on every future visit.

Trigger	Fires when visitor is in
A/B — Group A	Group A (~50% of visitors)
A/B — Group B	Group B (~50% of visitors)

Field	Description	Default
Test name	Unique identifier for this test — all elements sharing this name share the same group assignment	`default`

WARN

Use a different Test name for each independent A/B test on your site (e.g. hero_cta, pricing_table).

Setting up an A/B test

Create Element A: add trigger A/B — Group A → show, enable Hide initially, set Test name to my_test
Create Element B: add trigger A/B — Group B → show, enable Hide initially, set Test name to my_test

When the page loads, each visitor sees only one element.