Skip to content

myWsq/scroom

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

68 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

logo

npm Netlify Status

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";

Alternatives

About

A smart library for cool scrolling effects, based on Intersection Observer.

Topics

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors