scroll-out / Scroll Out
ScrollOut detects changes in scroll for reveal, parallax, and CSS Variable effects!
Stars: ✭ 1,033
Programming Languages
javascript
184084 projects - #8 most used programming language
typescript
32286 projects
Projects that are alternatives of or similar to Scroll Out
onscroll-effect
A tiny JavaScript library to enable CSS animations when user scrolls.
Stars: ✭ 35 (-96.61%)
Mutual labels: scrolling, transition
Snakke.js
🐍 Reading Position Indicator written in VanillaJS
Stars: ✭ 36 (-96.52%)
Mutual labels: scrolling
Fuckmyscroll.js
🔮 Animated scrolling to certain point or anchor
Stars: ✭ 10 (-99.03%)
Mutual labels: scrolling
Collectionviewpaginglayout
a simple but highly customizable paging layout for UICollectionView.
Stars: ✭ 947 (-8.33%)
Mutual labels: transition
Android scroll endless
Scroll endless for Android recyclerview
Stars: ✭ 12 (-98.84%)
Mutual labels: scrolling
React Picky Date Time
A react component for date time picker. Online demo examples
Stars: ✭ 31 (-97%)
Mutual labels: scrolling
React Intersection Observer
React component for the Intersection <Observer /> API
Stars: ✭ 940 (-9%)
Mutual labels: scrolling
Vueg Page Transition Plugin
为Vue应用添加页面间的转场特效( Page level transition plugin for vue-router)
Stars: ✭ 1,023 (-0.97%)
Mutual labels: transition
Angular Drag Scroll
Lightweight drag to scroll directive for AngularJS
Stars: ✭ 35 (-96.61%)
Mutual labels: scrolling
Scroll bars
Hide or show app bar and bottom navigation bar while scrolling.
Stars: ✭ 28 (-97.29%)
Mutual labels: scrolling
Fullpage.js
fullPage plugin by Alvaro Trigo. Create full screen pages fast and simple
Stars: ✭ 32,974 (+3092.06%)
Mutual labels: scrolling
Imagetransition
This project provides a library for making transitions between activities with shared images.
Stars: ✭ 13 (-98.74%)
Mutual labels: transition
Jtmaterialtransition
An iOS transition for controllers based on material design.
Stars: ✭ 966 (-6.49%)
Mutual labels: transition
Easytransform
Enhancing CSS transform with a little bit of JavaScript.
Stars: ✭ 10 (-99.03%)
Mutual labels: transition
Viewprt
A tiny, dependency-free, high performance viewport position & intersection observation tool
Stars: ✭ 36 (-96.52%)
Mutual labels: scrolling
React Whirligig
A react carousel/slider like component for sequentially displaying slides or sets of slides
Stars: ✭ 20 (-98.06%)
Mutual labels: transition
Cardviewlist
An elegant and responsive CardView like Android on iOS with Swift. Available horizontal and vertical scrolling with full animations and customizable.
Stars: ✭ 30 (-97.1%)
Mutual labels: scrolling
Akgpushanimator
Easily Push and Pop viewcontroller like Instagram App with Interaction
Stars: ✭ 44 (-95.74%)
Mutual labels: transition
Dragscroll
micro library for drag-n-drop scrolling style
Stars: ✭ 989 (-4.26%)
Mutual labels: scrolling
ScrollOut
Animate on Scroll
Why should I use this?
- Animate or reveal elements as they scroll into view using CSS or JavaScript
- Super tiny JavaScript library at 1KB minified and gzipped.
- Free for commercial and non-commercial use under the MIT license.
How do I use it?
Install ScrollOut and decorate elements with the data-scroll attribute. As elements become visible, data-scroll will be set to in and when elements are scrolled out they will be set with out. Add your own CSS or JS to make a big impression when things come into view. That's it!
Getting Started
Check out the documentation.
Compatibility
The core features are compatible on all modern desktop and mobile browsers. Internet Explorer 11 is also supported.
Maintainers
| Maintainer | GitHub | |
|---|---|---|
| Christopher Wallis | @notoriousb1t | @notoriousb1t |
| Stephen Shaw | @shshaw | @shshaw |
License
scroll-out is licensed under the MIT license.
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].