appeared.js
Track DOM elements as they scroll into and out of view.
Installation
via npm
npm install appeared
via yarn
yarn add appeared
Usage
Call appeared()
with a config object.
Configuration
The config object can have the following parameters:
-
elements
HTMLElement[]|HTMLElement|HTMLCollection|NodeList|string[]|string
or a function returning one of the types. -
appear
function to call when an element scrolls into view. -
disappear
function to call when an element scolls out of view. -
multiple
boolean that indicates if the (dis)appear callbacks should be called successively. Defaults to false.
The Watcher instance
The appeared()
function returns either a single or an array of Watcher
instances.
Watcher methods:
-
detroy
removes the event listeners from the window and clears the watcher
Example
import appeared from 'appeared'
appeared({
elements: ['.element', '#special-element'],
multiple: true,
appear: (element, count) => {
// Element scrolled into view
},
disappear: (element, count) => {
// Element scrolled out of view
}
})