# Fade

## Classes
```html
<span class="_fade">Fade</span>
<span class="_fadet">Fade Top</span>
<span class="_fadeb">Fade Bottom</span>
<span class="_fadel">Fade Left</span>
<span class="_fader">Fade Right</span>
<span class="_fadetplus">Fade Top Plus</span>
<span class="_fadebplus">Fade Bottom Plus</span>
<span class="_fadelplus">Fade Left Plus</span>
<span class="_faderplus">Fade Right Plus</span>
<span class="_fadetl">Fade Top Left</span>
<span class="_fadebl">Fade Bottom Left</span>
<span class="_fadetr">Fade Top Right</span>
<span class="_fadebr">Fade Bottom Right</span>
```

## Usage
<h2 id="animateMe" class="txtc _fadet">Animate me</h2>
<div class="div row wrp jst-center _fadeb">
    <span class="btn" onclick="Animation.animationById('animateMe', '_fade')">Fade</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadet')">Fade Top</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadeb')">Fade Bottom</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadel')">Fade Left</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fader')">Fade Right</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadetplus')">Fade Top Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadebplus')">Fade Bottom Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadelplus')">Fade Left Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_faderplus')">Fade Right Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadetl')">Fade Top Left</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadebl')">Fade Bottom Left</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadetr')">Fade Top Right</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadebr')">Fade Bottom Right</span>
</div>

```html
<h2 id="animateMe" class="txtc _fadet">Animate me</h2>
<div class="div row wrp jst-center _fadeb">
    <span class="btn" onclick="Animation.animationById('animateMe', '_fade')">Fade</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadet')">Fade Top</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadeb')">Fade Bottom</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadel')">Fade Left</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fader')">Fade Right</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadetplus')">Fade Top Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadebplus')">Fade Bottom Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadelplus')">Fade Left Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_faderplus')">Fade Right Plus</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadetl')">Fade Top Left</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadebl')">Fade Bottom Left</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadetr')">Fade Top Right</span>
    <span class="btn" onclick="Animation.animationById('animateMe', '_fadebr')">Fade Bottom Right</span>
</div>
```