Skip to content

Commit ef5df0a

Browse files
committed
feat(examples): added example page
1 parent f25e606 commit ef5df0a

File tree

7 files changed

+58
-17
lines changed

7 files changed

+58
-17
lines changed

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
[![Build Status](https://travis-ci.org/dev-warner/fadin.svg?branch=master)](https://travis-ci.org/dev-warner/fadin)
44
[![Coverage Status](https://coveralls.io/repos/github/dev-warner/fadin/badge.svg?branch=master)](https://coveralls.io/github/dev-warner/fadin?branch=master)
5+
[![npm version](https://badge.fury.io/js/fadin.svg)](https://badge.fury.io/js/fadin)
56

67
Extremely light onload fadin animation library.
78

docs/classes/fadin.html

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1004,7 +1004,7 @@ <h3>constructor</h3>
10041004
<li class="tsd-description">
10051005
<aside class="tsd-sources">
10061006
<ul>
1007-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L12">fadin.ts:12</a></li>
1007+
<li>Defined in fadin.ts:12</li>
10081008
</ul>
10091009
</aside>
10101010
<h4 class="tsd-parameters-title">Parameters</h4>
@@ -1026,7 +1026,7 @@ <h3><span class="tsd-flag ts-flagPrivate">Private</span> _detach</h3>
10261026
<div class="tsd-signature tsd-kind-icon">_detach<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">Function</span></div>
10271027
<aside class="tsd-sources">
10281028
<ul>
1029-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L12">fadin.ts:12</a></li>
1029+
<li>Defined in fadin.ts:12</li>
10301030
</ul>
10311031
</aside>
10321032
</section>
@@ -1036,7 +1036,7 @@ <h3><span class="tsd-flag ts-flagPrivate">Private</span> animation<wbr>Service</
10361036
<div class="tsd-signature tsd-kind-icon">animation<wbr>Service<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">AnimationService</span></div>
10371037
<aside class="tsd-sources">
10381038
<ul>
1039-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L11">fadin.ts:11</a></li>
1039+
<li>Defined in fadin.ts:11</li>
10401040
</ul>
10411041
</aside>
10421042
</section>
@@ -1053,7 +1053,7 @@ <h3>detach</h3>
10531053
<li class="tsd-description">
10541054
<aside class="tsd-sources">
10551055
<ul>
1056-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L34">fadin.ts:34</a></li>
1056+
<li>Defined in fadin.ts:34</li>
10571057
</ul>
10581058
</aside>
10591059
<div class="tsd-comment tsd-typography">
@@ -1075,7 +1075,7 @@ <h3>is<wbr>Done</h3>
10751075
<li class="tsd-description">
10761076
<aside class="tsd-sources">
10771077
<ul>
1078-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L27">fadin.ts:27</a></li>
1078+
<li>Defined in fadin.ts:27</li>
10791079
</ul>
10801080
</aside>
10811081
<div class="tsd-comment tsd-typography">
@@ -1097,7 +1097,7 @@ <h3>reset</h3>
10971097
<li class="tsd-description">
10981098
<aside class="tsd-sources">
10991099
<ul>
1100-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L41">fadin.ts:41</a></li>
1100+
<li>Defined in fadin.ts:41</li>
11011101
</ul>
11021102
</aside>
11031103
<div class="tsd-comment tsd-typography">
@@ -1119,7 +1119,7 @@ <h3>send<wbr>Scroll</h3>
11191119
<li class="tsd-description">
11201120
<aside class="tsd-sources">
11211121
<ul>
1122-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L49">fadin.ts:49</a></li>
1122+
<li>Defined in fadin.ts:49</li>
11231123
</ul>
11241124
</aside>
11251125
<div class="tsd-comment tsd-typography">
@@ -1141,7 +1141,7 @@ <h3><span class="tsd-flag ts-flagPrivate">Private</span> set<wbr>UpEvent<wbr>Lis
11411141
<li class="tsd-description">
11421142
<aside class="tsd-sources">
11431143
<ul>
1144-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L53">fadin.ts:53</a></li>
1144+
<li>Defined in fadin.ts:53</li>
11451145
</ul>
11461146
</aside>
11471147
<h4 class="tsd-parameters-title">Parameters</h4>

docs/globals.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -989,7 +989,7 @@ <h3>Fadin<wbr>Init</h3>
989989
<div class="tsd-signature tsd-kind-icon">Fadin<wbr>Init<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
990990
<aside class="tsd-sources">
991991
<ul>
992-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/index.ts#L3">index.ts:3</a></li>
992+
<li>Defined in index.ts:3</li>
993993
</ul>
994994
</aside>
995995
<div class="tsd-type-declaration">
@@ -1023,7 +1023,7 @@ <h3>User<wbr>Function</h3>
10231023
<div class="tsd-signature tsd-kind-icon">User<wbr>Function<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
10241024
<aside class="tsd-sources">
10251025
<ul>
1026-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/stack.ts#L8">stack.ts:8</a></li>
1026+
<li>Defined in stack.ts:8</li>
10271027
</ul>
10281028
</aside>
10291029
<div class="tsd-type-declaration">
@@ -1061,7 +1061,7 @@ <h3><span class="tsd-flag ts-flagConst">Const</span> fadin</h3>
10611061
<li class="tsd-description">
10621062
<aside class="tsd-sources">
10631063
<ul>
1064-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/index.ts#L5">index.ts:5</a></li>
1064+
<li>Defined in index.ts:5</li>
10651065
</ul>
10661066
</aside>
10671067
<h4 class="tsd-parameters-title">Parameters</h4>

docs/index.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -990,7 +990,7 @@ <h3>Fadin<wbr>Init</h3>
990990
<div class="tsd-signature tsd-kind-icon">Fadin<wbr>Init<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
991991
<aside class="tsd-sources">
992992
<ul>
993-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/index.ts#L3">index.ts:3</a></li>
993+
<li>Defined in index.ts:3</li>
994994
</ul>
995995
</aside>
996996
<div class="tsd-type-declaration">
@@ -1024,7 +1024,7 @@ <h3>User<wbr>Function</h3>
10241024
<div class="tsd-signature tsd-kind-icon">User<wbr>Function<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
10251025
<aside class="tsd-sources">
10261026
<ul>
1027-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/stack.ts#L8">stack.ts:8</a></li>
1027+
<li>Defined in stack.ts:8</li>
10281028
</ul>
10291029
</aside>
10301030
<div class="tsd-type-declaration">
@@ -1062,7 +1062,7 @@ <h3><span class="tsd-flag ts-flagConst">Const</span> fadin</h3>
10621062
<li class="tsd-description">
10631063
<aside class="tsd-sources">
10641064
<ul>
1065-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/index.ts#L5">index.ts:5</a></li>
1065+
<li>Defined in index.ts:5</li>
10661066
</ul>
10671067
</aside>
10681068
<h4 class="tsd-parameters-title">Parameters</h4>

docs/interfaces/fadinconfig.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -970,7 +970,7 @@ <h3><span class="tsd-flag ts-flagOptional">Optional</span> delay</h3>
970970
<div class="tsd-signature tsd-kind-icon">delay<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span></div>
971971
<aside class="tsd-sources">
972972
<ul>
973-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L4">fadin.ts:4</a></li>
973+
<li>Defined in fadin.ts:4</li>
974974
</ul>
975975
</aside>
976976
</section>
@@ -980,7 +980,7 @@ <h3><span class="tsd-flag ts-flagOptional">Optional</span> no<wbr>Inital<wbr>Scr
980980
<div class="tsd-signature tsd-kind-icon">no<wbr>Inital<wbr>Scroll<wbr>Event<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">true</span></div>
981981
<aside class="tsd-sources">
982982
<ul>
983-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L6">fadin.ts:6</a></li>
983+
<li>Defined in fadin.ts:6</li>
984984
</ul>
985985
</aside>
986986
</section>
@@ -990,7 +990,7 @@ <h3><span class="tsd-flag ts-flagOptional">Optional</span> selector</h3>
990990
<div class="tsd-signature tsd-kind-icon">selector<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string</span></div>
991991
<aside class="tsd-sources">
992992
<ul>
993-
<li>Defined in <a href="https://github.com/dev-warner/fadin/blob/28caa68/lib/fadin.ts#L5">fadin.ts:5</a></li>
993+
<li>Defined in fadin.ts:5</li>
994994
</ul>
995995
</aside>
996996
</section>

examples/basic/index.html

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
7+
<title>Document</title>
8+
</head>
9+
<body>
10+
<style>
11+
section {
12+
display: flex;
13+
}
14+
15+
.fade {
16+
opacity: 0;
17+
transition: 0.3s;
18+
}
19+
20+
.item {
21+
background-color: #ccc;
22+
height: 100vh;
23+
width: calc(33.33% - 10px);
24+
}
25+
</style>
26+
27+
<section>
28+
<div class="fade item"></div>
29+
<div class="fade item"></div>
30+
<div class="fade item"></div>
31+
</section>
32+
33+
<script src="./index.js"></script>
34+
</body>
35+
</html>

examples/basic/index.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
const fadin = require('fadin')
2+
3+
document.addEventListener("DOMContentLoaded", () => {
4+
fadin('.my-class', { delay: 200 })
5+
});

0 commit comments

Comments
 (0)