Install Using Yarn / Npm
To install Alpine Js intersect plugin use yarn / npm.
To install Alpine Js intersect plugin use yarn / npm.
yarn add @alpinejs/intersect npm install @alpinejs/intersect
Initialize the Plugin
Then initialize it from your bundle.
import Alpine from 'alpinejs' import intersect from '@alpinejs/intersect' Alpine.plugin(intersect)
Use the Plugin
To use the plugin just call the x-intersect directive and now once the user sees the section / intersect, the code will run.
<div x-data x-intersect="console.log('hello world')">
<!-- your content here -->
</div>
<div x-data x-intersect="@this.call('loadMoreData')">
<!-- your content here -->
</div>Related Snippet