uos
TypeScript icon, indicating that this package has built-in type declarations

1.2.0 • Public • Published

Update On Scroll (uos)

npm version gzip size license dependencies TypeScript

Update On Scroll (uos) is a tiny library to provide the easiest way for updating values on scroll. Based on percentual or pixel based begin and end values, progress is returned trough a callback.

This utility can be useful for CSS animations, DOM changes, WebGL transitions or anything that can be updated based on a progress value.

Features:

  • Small in size, no dependencies
  • Percentage or pixel based values
  • Optimized for multiple instances

Install

$ npm install --save uos

Usage

Import the library:

import updateOnScroll from 'uos';

Update an element based on pixels:

updateOnScroll(100, 500, progress => {
  // Progress between 100px and 500px
});

Update an element based on percentages:

updateOnScroll(0.2, 0.6, progress => {
  // Progress between 20% and 60%
});

Only a single scroll listener will be used regardless of how many instances are created. The callback of an instance will be called on every update.

License

MIT © Colin van Eenige

Readme

Keywords

Package Sidebar

Install

npm i uos

Weekly Downloads

179

Version

1.2.0

License

MIT

Unpacked Size

5.42 kB

Total Files

7

Last publish

Collaborators

  • vaneenige