用css3的animation完成一个动画,当只有这个动画完成时才执行令一个事件,比如让动画保持在终止的状态或其他一些事件。我们该怎么办呢。 
第一种方法: 
用计时器,设定一个和动画时长一样的time,过time事件去执行这个函数。 
setTimeout(function(){ },time); 
第二种方法:

当-webkit-animation动画结束时有一个webkitAnimationEnd事件,只要监听这个事件就可以了。

不同浏览器的AnimationEnd写法 (webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend)

拓展: 
1、-webkit-animation动画其实有三个事件: 
开始事件 webkitAnimationStart 
结束事件 webkitAnimationEnd 
重复运动事件 webkitAnimationIteration

css3的过渡属性transition,在动画结束时,也存在结束的事件:webkitTransitionEnd;

注意:transition,也仅仅有这一个事件。

css3用AnimationEnd判断动画是否完成, css3在动画完成后执行事件的更多相关文章

  1. css3在动画完成后执行事件

    第一种方法: 用计时器,设定一个和动画时长一样的time,过time事件去执行这个函数. setTimeout(function(){ },time); 第二种方法: 当-webkit-animati ...

  2. CSS3使用AnimationEnd为同一个元素添加多个动画效果

    <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name ...

  3. (判断)window.open()窗口被关闭后执行事件

    $(function() { // start ready var $article_share=$('#body .article').find('li.share'); // $article_s ...

  4. CSS3动画效果——js调用css动画属性并回调处理详解

    http://www.jb51.net/css/258407.html 这篇文章主要详细介绍了CSS3动画效果回调处理,需要的朋友可以参考下 我们在做js动画的时候,很多时候都需要做回调处理,如在一个 ...

  5. PageSlider中CSS3动画在除首屏之外先加载页面后执行动画的问题

    PageSlider中CSS3动画在除首屏之外先加载页面后执行动画的问题,PageSlider中加入CSS3动画的话,默认只有首屏是从无到有执行动画,其他屏都是显示下页面再执行动画 这就造成其他屏的动 ...

  6. 自己总结的CSS3中transform变换、transition过渡、animation动画的基本用法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  7. web前端学习(三)css学习笔记部分(8)-- SVN的介绍和应用、CSS动画效果、CSS3布局属性全接触

    15.SVN的介绍和应用 15.1.SVN的介绍和应用课程概要 将代码进行集中管理,有版本号的进行迭代,方便集体工作的build流程 15.2.SVN的介绍 SVN是Subversion的简称,是一个 ...

  8. css3支持动画吗?css3可以用于网页动画的展现吗

    CSS3 主要可以分为几个模块:边框和背景,渐变,文字特效,字体,2D/3D转换,动画(过渡动画和动画),选择器,盒模型,多列布局,用户界面. css3动画有2类:一种是transition的,另一种 ...

  9. CREATE CSS3是一款在线集成众多CSS3功能的生成器,可以在线生成常用的CSS3效果

    CREATE CSS3是一款在线集成众多CSS3功能的生成器,可以在线生成常用的CSS3效果 CREATE CSS3 彩蛋爆料直击现场 CREATE CSS3是一款在线集成众多CSS3功能的生成器,可 ...

随机推荐

  1. codeforces 425B Sereja and Table(状态压缩,也可以数组模拟)

    题目 给出一个n*m的01矩阵, 让你最多改变k个里面的值(0变1,1变0), 使得0.1的连通分量是矩阵.输出最少步数 1 ≤ n, m ≤ 100; 1 ≤ k ≤ 10 题解: 如果01连通分量 ...

  2. ActionResult 返回类型

    类名 抽象类 父类 功能 ContentResult     根据内容的类型和编码,数据内容. EmptyResult     空方法. FileResult abstract   写入文件内容,具体 ...

  3. 转载——有感于三个50岁的美国程序员的生活状态与IT职业杂想

    明天就是国庆节了,今天也不想干活干的太累了!写一篇以前去美国出差的杂想,对比于美国50多岁的程序员和大多数50多岁国内父母的生活状态有感而发. 前几年正好有一个项目的机会出差去了一次美国,地点是美国中 ...

  4. 未能正确加载“Microsoft.VisualStudio.Editor.Implementation.EditorPackage”

    VS2012启动/加载项目出问题 未能正确加载“Microsoft.VisualStudio.Editor.Implementation.EditorPackage, Microsoft.Visual ...

  5. (5)VS2010无法打开gl/glaux.h头文件的解决方法

    方法:下载缺少的文件. 参考自:http://blog.csdn.net/delphiwcdj/article/details/6326586 下载源1:CSDN下载OpenGL 安装包所需文件下载: ...

  6. java内存模型优化建议

    八.Java编程建议 根据GC的工作原理,我们可以通过一些技巧和方式,让GC运行更加有效率,更加符合应用程序的要求.一些关于程序设计的几点建议: 1)最基本的建议就是尽早释放无用对象的引用.大多数程序 ...

  7. Spring MVC 3.0.5+Spring 3.0.5+MyBatis3.0.4全注解实例详解(三)

    前两章我为大家详细介绍了如何搭建Maven环境.Spring MVC的流程结构.Spring MVC与Struts2的区别以及示例中的一些配置文件的分析.在这一章,我就对示例的层次结构进行说明,以及M ...

  8. Centos环境下部署游戏服务器-软件安装

    这篇文章主要介绍一下游戏服务器需要安装的软件和需要修改的配置.现介绍下项目,本项目服务器端是c++ + mysql组合,客户端是as写的,需要安装的服务为Mysql,Php,Apache, 以及一个n ...

  9. Linux 操作系统的用户和用户组管理

    Linux系统是一个多用户多任务的分时操作系统,任何一个要使用系统资源的用户,都必须首先向系统管理员申请一个账号,然后以这个账号的身份进入 系统.用户的账号一方面可以帮助系统管理员对使用系统的用户进行 ...

  10. iOS:模态弹出窗控制器UIPopoverPresentationController

    模态弹出窗控制器:UIPopoverPresentationController 实质:就是将内容控制器包装成PopoverPresentationController的形式,然后再模态出来,必须指定 ...