# Awesome animate on scroll
ODE Scroll is a modern and awesome animate on scroll library using CSS3. see demos and get started now.
## ⚙ installation
### CDN
Add styles in ``:
```html
```
Add script right before closing `` tag, and initialize ODEScroll:
```html
```
### package managers
* `npm install --save odescroll`
or * `yarn add odescoll`
#### import files
```js
import { odescroll } from "odescroll"
import "odescroll/styles.css"
```
## Usage
### 1- Initialize
Call initialize function after dom content loaded
```js
odescroll.init()
```
with Options
```js
odescroll.init({
option: value
})
```
### Options Table
| option | dataType | default | values | Description |
|------------------|-----------------|--------------------------|------------------|-----------------------------------------------------------|
| transition | number | 0.8s | 0-∞ | |
| easing | string | ease-out | custem | |
| once | boolean | true | true/false | |
| oneDirection | boolean | true | true/false | |
| threshold | number | 0.8 | 0 - 1 | |
### custem options for each Element as Attribute
* data-odescroll-transition
* data-odescroll-easing
### 2- Set animation
```html
```
with option
```html
```
## Demos
* https://scroll.o-de.org/demos
## Animations
* Fade animations:
* fade-up
* fade-down
* fade-left
* fade-right
* fade-up-right
* fade-up-left
* fade-down-right
* fade-down-left