Skip to content

Commit a6331ab

Browse files
Update README.md
1 parent 80a948a commit a6331ab

File tree

1 file changed

+21
-0
lines changed

1 file changed

+21
-0
lines changed

README.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,24 @@
11
# anim8js-jquery
22

33
[anim8](https://github.com/ClickerMonkey/anim8js) your HTML elements with [jQuery](https://jquery.com/)
4+
5+
### jQuery Functions
6+
7+
A few functions are available for jQuery which will help you animate jQuery objects:
8+
- `m8/anim8/animator`: returns an animator instance for the first element in the jQuery object.
9+
- `m8s/anim8s/animators`: returns animators for all elements in the jQuery object.
10+
- `dataPlay`: plays the animation specified in the `data-...` attribute for all elements in the jQuery object and returns a jQuery object which contains only elements that had a valid animation to play.
11+
- `dataQueue`: queues the animation specified in the `data-...` attribute for all elements in the jQuery object and returns a jQuery object which contains only elements that had a valid animation to queue.
12+
- `dataTransition`: transitions into the animation specified in the `data-...` attribute for all elements in the jQuery object and returns a jQuery object which contains only elements that had a valid animation to transition into.
13+
14+
For example if you have the following HTML:
15+
16+
```html
17+
<div id="box" data-intro="fadeIn ~5s" data-outro="flipOutX 0.5s">Hello World!</div>
18+
```
19+
20+
You can play the specified animations with...
21+
22+
```javascript
23+
$('#box').dataPlay('intro').dataQueue('outro');
24+
```

0 commit comments

Comments
 (0)