咨询电话:
15628812133
13
2017/01

animate.css是什么,该如何使用

发布时间:2017-01-13 15:05:35
发布者:369563174
浏览量:
0

animate.css是一个css3动画库,里面预设了很多种常用的动画,使用简单,因为它是把不同的动画写到了不同的类里,所以我们想要使用哪种动画的时候,只需要简单的类添加到元素上就行了:

1、首先引入animate css文件

百度cdn:

2、给指定的元素加上指定的动画样式名

这里包括两个class名,第一个是必须添加的样式名,任何想实现的元素都得添加这个。第二个是指定的动画样式名。比如我们官方网站头部就引用了这个动画:

    图片1.png

    3、如果说想给某个元素动态添加动画样式,可以通过jquery追加class来实现,同样animated是必带,第二个是动画:

    $('#yourElement').addClass('animated bounceOutLeft');

    4、你可以更改动画默认持续的时间:animate-duration: 1s; 动画延迟时间:animate-delay: 1s; 动画执行次数:animate-iteration-count: 1;

      设置完以上的内容这个动画就可以执行了,他的动画效果非常多,具体可以去他的演示网站参考。

    关键词:
    返回列表