Animate css3动画 使用文档

原创 2016年08月30日 16:08:39

1.先引入animate.min.css 文件。
下载网址:http://apps.bdimg.com/libs/animate.css/3.1.0/animate.min.css

2.效果实现有两种方式:

2.1给指定的元素加上类 “animated bounceOutLeft” ,animate是基本类 必须加上,而后一个就是根据自己想要的效果来增加类。
2.2添加动态效果,可以用jq来实现

$('#yourElement').addClass('animated bounceOutLeft').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
   $(this).removeClass();
})

注:当动画效果执行完成后还可以通过以下代码添加事件

$('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimatio nend animationend', doSomething); 

整理的压缩包下载: http://pan.baidu.com/s/1nuDrHhv

版权声明:本文为博主原创文章,未经博主允许不得转载。

强大而酷炫的CSS3动画库Animate.css使用方法

今天介绍一个强大的CSS3库 Animate.css 库如其名 ,是一个动画库 通过它我们非常轻松地添加动画效果 “Just-add-water CSS animations” 像灌水一样简...

css3动画简介以及动画库animate.css的使用

在这个年代,你要是不懂一点点css3的知识,你都不好意思说你是个美工。美你妹啊,请叫我前端工程师好不好。呃。。好吧,攻城尸。。。呵呵,作为一个攻城尸,没有点高端大气上档次的东西怎么能行呢,那么css3...

css3动画简介以及动画库animate.css的使用

过渡动画        第一种叫过渡(transition)动画,就是从初始状态过渡到结束状态这个过程中所产生的动画。所谓的状态就是指大小、位置、颜色、变形(transform)等等这些属性。c...

css3动画简介以及动画库animate.css的使用

在这个年代,你要是不懂一点点css3的知识,你都不好意思说你是个美工。美你妹啊,请叫我前端工程师好不好。呃。。好吧,攻城尸。。。呵呵,作为一个攻城尸,没有点高端大气上档次的东西怎么能行呢,那么css3...

jQuery/CSS3炫酷动画效果插件 animate

jQuery是一款很强大的JavaScript框架,本文介绍的9个应用插件很多都是基于jQuery的,另外,CSS3的应用让这些插件增添了不少光彩,特别是第一个动画插件Animate.css非常实用,...

animate.css – 齐全的CSS3动画库

本文转载自网络,方便大家学习:http://www.dowebok.com/98.html原网站有动画实例,建议 JavaScript 或 jQuery 给需要的地方添加动画效果,不用改变原来的结构简...

animate.css高大上的CSS3动画库

Animate.css是一款兼容多款浏览器的CSS3动画库,使用方便,效果绚丽。 Animate.css的兼容性Animate.css的用法下载Animate.css官网的github上animate...

CSS3 animate实现图片墙3D翻转效果

原文出处:http://www.html5china.com/CSS3/20101226_729.html 一、前面的唠叨(注意浏览器支持哦) 老实讲,起初研究CSS3的一些东西真是很兴奋的,哇...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Animate css3动画 使用文档
举报原因:
原因补充:

(最多只允许输入30个字)