Skip to content

stutrek/scrollmonitor

Repository files navigation

scrollMonitor

The scroll monitor allows you to receive events when elements enter or exit a viewport. It does this using watcher objects, which watch an element and trigger events. Watcher objects also contain information about the element they watch, including the element's visibility and location relative to the viewport. If your scroll container is an element other than the body you can create a container that creates watchers.

The scroll monitor was designed to be very fast. On each scroll event the DOM is only touched twice, once to find the document height and again to find the viewport top. No variables are declared, nor are any objects, arrays, or strings created. Watchers are very cheap. Create them liberally.

The code is vanilla javascript and has no external dependencies, however the script cannot be put in the head.

Also see the React hooks, React component and the parallax library.

Basic Usage