IE9及更早版本的IE浏览器都不支持css3动画
谷歌浏览器、火狐浏览器、IE10+浏览器以及移动端浏览器等这些都支持css3动画
animate.css内置了很多典型的css3动画
 
用法
 
1、首先引入animate css文件
<head>
  <link rel="stylesheet" href="animate.min.css">
</head>
 
2、给指定的元素加上指定的动画样式名
<div class="animated bounceOutLeft"></div>
这里包括两个class名，第一个是基本的，必须添加的样式名，任何想实现的元素都得添加这个。第二个是指定的动画样式名。
 
3、如果说想给某个元素动态添加动画样式，可以通过jquery来实现：
$('#yourElement').addClass('animated bounceOutLeft');
 
4、当动画效果执行完成后还可以通过以下代码添加事件
$('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', doSomething);

使用CSS3动画库animate.css的更多相关文章

  1. 强大的CSS3动画库animate.css

    今天要给大家介绍一款强大的CSS3动画库animate.css,animate.css定义了大概50多种动画形式,包括淡入淡出,文字飞入.左右摇摆动画等等.使用animate.css也非常简单,你可以 ...

  2. CSS3动画库——animate.css

    初见animate.css的时候,感觉很棒,基本上很多常用的CSS3动画效果都帮我们写好了,所以想要哪一种效果直接就可以拿过来用,甚是方便: 效果展示官网:http://daneden.github. ...

  3. CSS3动画库animate.css

    在线演示 本地下载

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

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

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

    ~~~ transition  animation 和 animate.css 在这个年代,你要是不懂一点点css3的知识,你都不好意思说你是个美工.美你妹啊,请叫我前端工程师好不好.呃..好吧,攻城 ...

  6. 【转载】css3动画简介以及动画库animate.css的使用

    原文地址:http://www.cnblogs.com/2050/p/3409129.html 在这个年代,你要是不懂一点点css3的知识,你都不好意思说你是个美工.美你妹啊,请叫我前端工程师好不好. ...

  7. 如何使用动画库animate.css

    animate.css是一个CSS3动画库,里面预设了抖动(shake).闪烁(flash).弹跳(bounce).翻转(flip).旋转(rotateIn/rotateOut).淡入淡出(fadeI ...

  8. 动画库animate.css的用法

    简介 animate.css是一个来自国外的 CSS3 动画库,它预设了引起弹跳(bounce).摇摆(swing).颤抖(wobble).抖动(shake).闪烁(flash).翻转(flip).旋 ...

  9. CSS动画库——animate.css的使用

    Animate.css是一款强大的CSS3动画库 官网地址:https://daneden.github.io/animate.css/ 使用方法如下所示: (1)下载animate.css 下载地址 ...

随机推荐

  1. system verilog中的类型转换（type casting）、位宽转换（size casting）和符号转换（sign casting）

    类型转换 verilog中,任何类型的任何数值都用来给任何类型赋值.verilog使用赋值语句自动将一种类型的数值转换为另一种类型. 例如,当一个wire类型赋值给一个reg类型的变量时,wire类型 ...

  2. VMWare虚拟机 使用vmtools拷贝文件 临时文件问题

    Win7下, 临时文件会存放在路径C:\Users\admin\AppData\Local\Temp\vmware-admin\VMwareDnD,如果不及时删除,C盘就会越来越大直至放满.

  3. jeecg 扩展封装查询条件 时间段查询

    使用jeecg框架开发的小伙伴们知道,添加查询条件,通常是我们加一个配置(query="true")就可以将该字段设置为查询条件.简单方便.但是这样的配置查询条件仅适用于输入框输入 ...

  4. java时间类简单总结

    java时间类(Data类) 1.Data类(没有考虑到国际化,好多方法已过时java.util.Data包中) 父类(是类不是接口含有直接子类3个):  日期格式为:年月日时分秒(不包含毫秒部分) ...

  5. Scorpio-CSharp简介

    Scorpio-CSharp是为了解决Unity游戏各个平台热更新的问题,纯c#实现 基于.net2.0 兼容所有c#平台 语法类似 javascript, 设计初衷是为了做一个所有人都能修改的热更新 ...

  6. 脚本工具: 查看当前系统被写入的FD

    #!/bin/bash touch /tmp/sn2 /tmp/sn4 /tmp/sn6 /tmp/sn3 redir=/dev/null which lsof >&/dev/null ...

  7. C#pdf 切割成图片

    引用 using Ghostscript.NET;using Ghostscript.NET.Rasterizer; 需要安装 exe文件 public static GhostscriptVersi ...

  8. vim的树形菜单NERDTREE的设置

    网上比较好的一篇文章:http://coolshell.cn/articles/1679.html http://coolshell.cn/articles/11312.html 1.Vim安装NER ...

  9. MIME Sniffing

    Abstract: The web.config file does not include the required header to mitigate MIME sniffing attacks ...

  10. c语言warning总结

    1.function declaration isn’t a prototype括号中无参数,也要加void 2.array subscript is above array bounds数组下标大于 ...