Skip to content

Commit a7cb99b

Browse files
committed
update README
1 parent b5dd7bf commit a7cb99b

File tree

1 file changed

+26
-0
lines changed

1 file changed

+26
-0
lines changed

README.md

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,32 @@
22

33
CSS for button that loads. check https://loading.io/button/ for more information.
44

5+
# usage
6+
7+
1. include ldbtn.css and loading.:
8+
9+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/loadingio/[email protected]/dist/ldbtn.css"/>
10+
11+
12+
2. add class for one of the desired effect to your button, along with a loader inside:
13+
14+
<div class="btn btn-primary ld-ext-right">
15+
<div class="ld ld-ball ld-bounce"></div>
16+
</div>
17+
18+
- The *ld-ball* and *ld-bounce* classes used here are from [loading.css](https://loading.io/animation/). You can use your own animation.
19+
- The class *ld* is required for loading buttons to identify the loader element.
20+
21+
3. Trigger the loading animation by adding "running" class in the button:
22+
23+
<div class="btn btn-primary ld-ext-right running">
24+
<div class="ld ld-ball ld-bounce"></div>
25+
</div>
26+
27+
You can also use [ldLoader](https://loading.io/lib/loader/) to manipulate loader's state.
28+
29+
For more information about how to use loading buttons, please check the [online documentation here](https://loading.io/button/).
30+
531

632
# License
733

0 commit comments

Comments
 (0)