Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dev-warner/fadin
feather light javascript animation on scroll library
https://github.com/dev-warner/fadin
Last synced: 15 days ago
JSON representation
feather light javascript animation on scroll library
- Host: GitHub
- URL: https://github.com/dev-warner/fadin
- Owner: dev-warner
- License: mit
- Created: 2019-03-17T01:43:25.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-03T17:57:35.000Z (almost 2 years ago)
- Last Synced: 2024-01-26T12:08:51.717Z (9 months ago)
- Language: TypeScript
- Size: 3.18 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 18
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Fadin
[![Build Status](https://travis-ci.org/dev-warner/fadin.svg?branch=master)](https://travis-ci.org/dev-warner/fadin)
[![Coverage Status](https://coveralls.io/repos/github/dev-warner/fadin/badge.svg)](https://coveralls.io/github/dev-warner/fadin)
Extremely light fade in animation library. 3kb in size ungzipped :rocket:
# Getting Started
- [Documentation](http://fadin-docs.surge.sh/)
- [Example site](http://fadin-example-basic.surge.sh/)run in your terminal
```sh
$ npm i fadin
``````javascript
const fadin = require('fadin')document.addEventListener('DOMContentLoaded', () => {
fadin('.my-class', { delay: 200 })
})
``````html
``````css
.my-class {
opacity: 0;
transition: 0.3s opacity;
}
```
# Todo list
- add more documentaion comments / clear up
- add options to fade in any direction
- make more performant/smooth
- let options be functions and values## License
This project is licensed under the MIT License - see the LICENSE.md file for details
**Free Software, Hell Yeah!**