GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects â†’ Twikito â†’ onscroll-effect

Twikito / onscroll-effect

Licence: MIT license
A tiny JavaScript library to enable CSS animations when user scrolls.

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Labels

cssanimationscrollingscrolltoggletransitionviewportuser-scrollsonscroll

Projects that are alternatives of or similar to onscroll-effect

react-scroll-trigger
📜 React component that monitors scroll events to trigger callbacks when it enters, exits and progresses through the viewport. All callback include the progress and velocity of the scrolling, in the event you want to manipulate stuff based on those values.
Stars: ✭ 126 (+260%)
Mutual labels:  scrolling, scroll, viewport
Scroll Snap
↯ Snap page when user stops scrolling, with a customizable configuration and a consistent cross browser behaviour
Stars: ✭ 187 (+434.29%)
Mutual labels:  scrolling, scroll
Scroll Js
Light cross-browser scroller that uses native javascript
Stars: ✭ 179 (+411.43%)
Mutual labels:  scrolling, scroll
React Indiana Drag Scroll
React component which implements scrolling via holding the mouse button or touch
Stars: ✭ 190 (+442.86%)
Mutual labels:  scrolling, scroll
Ngx Ui Scroll
Infinite/virtual scroll for Angular
Stars: ✭ 145 (+314.29%)
Mutual labels:  scrolling, scroll
React Intersection Observer
React implementation of the Intersection Observer API to tell you when an element enters or leaves the viewport.
Stars: ✭ 2,689 (+7582.86%)
Mutual labels:  scrolling, viewport
Infinitescroll
Infinite Scroll (Endless Scrolling) for RecyclerView in Android
Stars: ✭ 183 (+422.86%)
Mutual labels:  scrolling, scroll
react-is-scrolling
Simply detect if users are scrolling in your components in a declarative API
Stars: ✭ 17 (-51.43%)
Mutual labels:  scrolling, scroll
Moveto
A lightweight scroll animation javascript library without any dependency
Stars: ✭ 2,746 (+7745.71%)
Mutual labels:  scrolling, scroll
V Bar
The virtual responsive crossbrowser scrollbar component for VueJS 2x
Stars: ✭ 216 (+517.14%)
Mutual labels:  scrolling, scroll
Jquery Scrolllock
Locks mouse wheel scroll inside container, preventing it from propagating to parent element
Stars: ✭ 109 (+211.43%)
Mutual labels:  scrolling, scroll
scroll-sync-react
A scroll syncing library for react that is up to date
Stars: ✭ 49 (+40%)
Mutual labels:  scrolling, scroll
Prognroll
A tiny, lightweight jQuery plugin that creates scroll progress bar on the page.
Stars: ✭ 108 (+208.57%)
Mutual labels:  scrolling, scroll
Horizontal Scroll
Horizontal scroll with inertia
Stars: ✭ 175 (+400%)
Mutual labels:  scrolling, scroll
Pd Select
vue components ,like ios 3D picker style,vue 3d 选择器组件,3D滚轮
Stars: ✭ 101 (+188.57%)
Mutual labels:  scrolling, scroll
Scroll Out
ScrollOut detects changes in scroll for reveal, parallax, and CSS Variable effects!
Stars: ✭ 1,033 (+2851.43%)
Mutual labels:  scrolling, transition
Viewprt
A tiny, dependency-free, high performance viewport position & intersection observation tool
Stars: ✭ 36 (+2.86%)
Mutual labels:  scrolling, viewport
Dragscroll
micro library for drag-n-drop scrolling style
Stars: ✭ 989 (+2725.71%)
Mutual labels:  scrolling, scroll
Stickyfill
Polyfill for CSS `position: sticky`
Stars: ✭ 2,252 (+6334.29%)
Mutual labels:  scrolling, scroll
angular-inviewport
A simple lightweight library for Angular with no other dependencies that detects when an element is within the browser viewport and adds a "sn-viewport-in" or "sn-viewport-out" class to the element
Stars: ✭ 72 (+105.71%)
Mutual labels:  scrolling, viewport
View All Similar Projects âž”

onScroll Effect

A tiny JavaScript library to enable CSS animations when user scrolls.

This library allows you to toggle one or more classes on an element when it appears inside the viewport when the user scrolls the page. It enables you to build CSS transitions or animations launched only when the user scrolls the page to the element. All you have to do is set a few HTML attributes, and code the rest with your CSS skills.

Go check the full documentation.

Status

GitHub release (latest by date) npm npm bundle size npm bundle size

David David

Quick start

Several quick start options are available:

Documentation

onScroll Effect's full documentation is hosted on GitHub Pages at twikito.github.io/onscroll-effect/.

Contribution

License

MIT. Copyright (c) Matthieu Bué

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].