All Projects → vaneenige → Uos

vaneenige / Uos

Licence: mit
🐭 A tiny 250b scroll listener with progress.

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Uos

Scrollprogress
🛸 Light weight library to observe the viewport scroll position
Stars: ✭ 148 (-57.59%)
Mutual labels:  observer, scroll, progress
uot
🦁 A tiny setTimeout alternative with progress.
Stars: ✭ 43 (-87.68%)
Mutual labels:  observer, progress
Swiftuix
Extensions and additions to the standard SwiftUI library.
Stars: ✭ 4,087 (+1071.06%)
Mutual labels:  scroll
Asscroll
Ash's Smooth Scroll 🍑
Stars: ✭ 324 (-7.16%)
Mutual labels:  scroll
Loading Bar
Flexible, light weighted and super fast Progress Bar Library
Stars: ✭ 300 (-14.04%)
Mutual labels:  progress
React Horizontal Scrolling Menu
Horizontal scrolling menu component for React.
Stars: ✭ 289 (-17.19%)
Mutual labels:  scroll
Qier Progress
💃 Look at me, I am a slim progress bar and very colorful / 支持彩色或单色的顶部进度条
Stars: ✭ 307 (-12.03%)
Mutual labels:  progress
Circle
你没有看错,全是纯手工打造!
Stars: ✭ 269 (-22.92%)
Mutual labels:  progress
Jump.js
A modern smooth scrolling library.
Stars: ✭ 3,459 (+891.12%)
Mutual labels:  scroll
Vue Happy Scroll
基于vue2.0实现的滚动条插件。scroll component for vue2.0
Stars: ✭ 299 (-14.33%)
Mutual labels:  scroll
Event
The Hoa\Event library
Stars: ✭ 319 (-8.6%)
Mutual labels:  observer
React Native Pagination
Animated Pagination For React Native's ListView, FlatList, and SectionList
Stars: ✭ 296 (-15.19%)
Mutual labels:  scroll
Gradient Widgets
Flutter widgets wrapped with gradients
Stars: ✭ 290 (-16.91%)
Mutual labels:  progress
Circleprogressview
🎡 CircleProgressView是一个圆形渐变的进度动画控件(支持外环显示刻度,内环随之变化,配置参数完全可配),动画效果纵享丝滑。
Stars: ✭ 314 (-10.03%)
Mutual labels:  progress
Progressstatusbar
Another way to show progress. A progress View over the system StatusBar.
Stars: ✭ 283 (-18.91%)
Mutual labels:  progress
Vue Scrollama
Vue component to easily setup scroll-driven interactions (aka scrollytelling)
Stars: ✭ 326 (-6.59%)
Mutual labels:  scroll
Stepprogressview
Step-by-step progress view with labels and shapes. A good replacement for UIActivityIndicatorView and UIProgressView.
Stars: ✭ 272 (-22.06%)
Mutual labels:  progress
Uumarqueeview
[iOS]Customizable marquee view. #Marquee,MarqueeView,跑马灯,滚屏,上翻,左滑,多行,自定义
Stars: ✭ 295 (-15.47%)
Mutual labels:  scroll
Waitme
jquery plugin for easy creating loading css3/images animations
Stars: ✭ 302 (-13.47%)
Mutual labels:  progress
Observable
The easiest way to observe values in Swift.
Stars: ✭ 346 (-0.86%)
Mutual labels:  observer

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

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].