Table of Contents & Menu
On this page

No subsections

Navigation

The Alpine.js x-intersect plugin

Alpine.js v3 includes the x-intersect plugin, which triggers JavaScript when an element scrolls into or out of the browser viewport.

Hyvä v1.1.10+ backports x-intersect to Alpine.js v2. This enables writing forward-compatible code that will continue to work seamlessly when Hyvä upgrades to Alpine v3.

For more details, refer to the official Alpine.js `x-intersect` plugin documentation.

<div x-data="{ shown: false }" x-intersect="shown = true">
    <div x-show="shown" x-transition>
        I'm in the viewport!
    </div>
</div>