Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/scroll-out/scroll-out

ScrollOut detects changes in scroll for reveal, parallax, and CSS Variable effects!
https://github.com/scroll-out/scroll-out

animation css css-classes javascript scroll-events scrolling transition

Last synced: 27 days ago
JSON representation

ScrollOut detects changes in scroll for reveal, parallax, and CSS Variable effects!

Awesome Lists containing this project

README

        

# ScrollOut

*Animate on Scroll*

[![npm version](https://badge.fury.io/js/scroll-out.svg)](https://badge.fury.io/js/scroll-out) [![Downloads](https://img.shields.io/npm/dm/scroll-out.svg)](https://www.npmjs.com/package/scroll-out)
[![gzip size](http://img.badgesize.io/https://unpkg.com/scroll-out/dist/scroll-out.min.js?compression=gzip&label=gzip%20size&style=flat&cache=false)](https://unpkg.com/scroll-out/dist/scroll-out.min.js)

## 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](https://scroll-out.github.io/).

## Compatibility

The core features are compatible on all modern desktop and mobile browsers. Internet Explorer 11 is also supported.

## Maintainers

| Maintainer | GitHub | Twitter |
| :- | :- | :- |
| Christopher Wallis | [@notoriousb1t](https://github.com/notoriousb1t) | [@notoriousb1t](https://twitter.com/notoriousb1t) |
| Stephen Shaw | [@shshaw](https://github.com/shshaw) | [@shshaw](https://twitter.com/shshaw) |

## License

scroll-out is licensed under the [MIT license](http://opensource.org/licenses/MIT).