scroom
scroom copied to clipboard
A smart library for cool scrolling effects, based on Intersection Observer.
Scroom is a smart library for cool scrolling effects, based on Intersection Observer.
Check Documentation and examples.
Features
- High Performance
- Friendly To Use
- Typrscript Support
- Lightweight ( 2kb or less by ES Module treeshaking )
Installation
$ npm install scroom
Usage
import { createScroom } from "scroom";
const sc = createScroom({
target: document.querySelector(".target-element"),
offset: 0.5,
});
sc.on("progress", (e) => {
console.log(e.progress);
});
Auto Resize Detection
You don't have to worry about "resize". You can change the size as much as you want, and Scroom will always worked.
Browser Compatibility
Same with Intersection Observer. You can optimize the compatibility by including polyfill.
$ npm install intersection-observer
And import it.
import "intersection-observer";