```
[检查所有的动画在这里！](https://daneden.github.io/animate.css/)
##使用
在你的网站上使用animate.css，只需拖放到您的文档中的样式表 ``, 并添加class `animated` 到一个元素，以及任何动画名称。这是它！你已经有了一个CSS动画元素。好极了 !
```html
```
你可以做很多其他的东西animate.css当你结合jQuery或添加您自己的CSS规则。动态添加使用jQuery轻松动画：
```javascript
$('#yourElement').addClass('animated bounceOutLeft');
```
当动画结束时，也可以检测到：
```javascript
$('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', doSomething);
```
[View a video tutorial](https://www.youtube.com/watch?v=CBQGl6zokMs) 关于如何使用Animate.css使用jQuery在这里。
**Note:** `jQuery.one()` 当你想在大多数情况下执行该事件处理程序时 *once*. 更多信息 [here](http://api.jquery.com/one/).
你可以改变你的动画的时间，增加一个延迟或改变它所扮演的次数：
```css
#yourElement {
-vendor-animation-duration: 3s;
-vendor-animation-delay: 2s;
-vendor-animation-iteration-count: infinite;
}
```
*Note: be sure to replace "vendor" in the CSS with the applicable vendor prefixes (webkit, moz, etc)*
## 自定义生成
Animate.css由 [Grunt](http://gruntjs.com), 您可以创建自定义很容易地构建。首先，你需要步兵和其他所有依赖关系：
```sh
$ cd path/to/animate.css/
$ sudo npm install
```
Next, run `grunt watch` to watch for changes and compile your custom builds. For example, if you want only some of the the “attention seekers”, simply edit the `animate-config.json` file to select only the animations you want to use.
```javascript
"attention_seekers": {
"bounce": true,
"flash": false,
"pulse": false,
"shake": true,
"headShake": true,
"swing": true,
"tada": true,
"wobble": true,
"jello":true
}
```
## 许可证
animate.css授权MIT许可下. (http://opensource.org/licenses/MIT)
## Contributing
Pull requests are the way to go here. I apologise in advance for the slow action on pull requests and issues. I only have two rules for submitting a pull request: match the naming convention (camelCase, categorised [fades, bounces, etc]) and let us see a demo of submitted animations in a [pen](http://codepen.io). That last one is important.