对非动画的实现排队,比如这个css()是要放在回调函数里才能,让前面的动画执行完成后在进行实现

 $('button').click(function(event) {
$(this).next().animate({'left':'300px','height':'100px'},3000)
.animate({'top':'200px','width':'100px'},3000,function(){
$(this).css('background','red');
})
});
// $('button').trigger('click'); 自动执行函数

 html

    <button>点击执行</button>
<div>
动画排队
</div>

css

*{margin: 0; padding: 0;list-style: none;}
div{width: 300px;height: 200px;background-color:pink;margin:20px;text-align: center;line-height: 200px;position:absolute;}
button{margin:50px;}

animate动画回调函数的更多相关文章

  1. 关于transition回调函数的几种写法

    平时工作中经常遇到需要transition动画结束后触发某个功能的问题,但是在映像中好像只见过animate的回调函数, 而transition的很多属性无法在animate中使用,经过一些总结归纳, ...

  2. 如何写JavaScript中的callback回调函数

    如何写回调函数? 如果自己在写一个方法或函数,你有可能会遇到需要一个回调函数.下面就是一个简单的常见回调函数例子: function mySandwich(param1, param2, callba ...

  3. JS---最终版本--封装缓动(变速)动画函数---增加任意多个属性&回调函数&层级&透明度

    封装缓动(变速)动画函数---增加任意多个属性&回调函数&层级&透明度 相较之前的,增加了2个判断,第一个判断是不是透明度,第二个判断是不是zindex, 都不是,就只是普通属 ...

  4. JS---封装缓动(变速)动画函数---增加任意多个属性&增加回调函数

    封装缓动(变速)动画函数---增加任意多个属性&增加回调函数 回掉函数fn,在所有元素到达目的位置后,判断是否传入一个函数,有就调用 if(fn){fn()}; 这样一次点击,产生多个动画 & ...

  5. jQuery基础的动画里面的回调函数

    <style> *{margin:0; padding:0;} #target{ border-radius:10px; background:#eee; } .fade{/*动画起始状态 ...

  6. 原生js判断css动画结束 css 动画结束的回调函数

    原文:原生js判断css动画结束 css 动画结束的回调函数 css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画是否结束:即使是采用CSS技术生成动画效果,Jav ...

  7. 原生js判断css3动画过度(transition)结束 transitionend事件 以及关键帧keyframes动画结束(animation)回调函数 animationEnd 以及 css 过渡 transition无效

      上图的 demo 主要讲的 是 css transition的过渡回调函数transitionend事件: css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画 ...

  8. Unity---DOTween插件学习(2)---设置参数、Ease曲线、回调函数、动画控制函数

    目录 6.Set设置参数 7.Ease曲线 8.回调函数 9.动画控制函数 本文及系列参考于Andy老师的DOTween系列 欢迎大家关注Andy老师 6.Set设置参数 在Unity中添加一个Cub ...

  9. jquery动画函数里面可以跟一个回调函数,表示动画结束后执行的代码

    jquery动画函数里面可以跟一个回调函数,表示动画结束后执行的代码 使用js监听动画结束后进行的操作: $ele.fadeIn(300,function(){...}) $ele.fadeOut(3 ...

随机推荐

  1. 【PHP】PHP初学者的学习线路

    先来看下PHP初学者的学习线路: (1) 熟悉HTML/CSS/JS等网页基本元素,完成阶段可自行制作简单的网页,对元素属性相对熟悉. (2) 理解动态语言的概念和运做机制,熟悉基本的PHP语法. ( ...

  2. 使用PHP创建一个REST API(译)

    最近API在网络领域有些风靡,明确的说是REST的影响力.这实在没什么好惊讶的,因为在任何编程语言中,消费REST API都是非常的容易.构建它也非常的简单,因为本质上你不会用到任何那些已存在很久的H ...

  3. 开源的挖矿软件,sha256

    http://cryptomining-blog.com/tag/sha-256d-miner/ https://github.com/cbuchner1/CudaMiner/blob/master/ ...

  4. 人活着系列之开会(Floy)

    http://acm.sdut.edu.cn/sdutoj/problem.php?action=showproblem&problemid=2930 题意:所有点到Z点的最短距离.因为岛名由 ...

  5. asp.net本地读取excel正确。但在iis服务器上就报错 未在本地计算机上注册“Microsoft.ACE.OleDb.12.0”提供程序

    本地vs2010可以上传ecxel文件.并读取数据,但部署到本地IIS.并访问.则提示: 未在本地计算机上注册“Microsoft.ACE.OleDb.12.0”提供程序 首先:确保安装了Micros ...

  6. ModelSim使用$display查看变量值和输出信息

    打开ModelSim,新建工程->新建Verilog文件demo.v 输入文件内容 module demo(); reg[3:0] a,b; initial begin $display(&qu ...

  7. ARM中的汇编指令

    Arm指令,32位的指令集,一共有16条的基本指令,每条指令都可以按条件执行, 指令都是32bit的,高四位是条件码[31:28], Thumb指令,16位的指令集,执行效率比arm指令集要低,但是节 ...

  8. 文本按列导入excel

    打开excel,选择数据选项卡,自文本选项.

  9. eclipse调优

    基于Eclipse 4.7.0 (Oxygen) 目的:加快eclipse启动速度 修改eclipse安装目录下配置文件eclipse.ini(1)指定eclipse运行的jre,不让其进行搜索-vm ...

  10. linux常用命令:service 命令

    service命令用于对系统服务进行管理,比如启动(start).停止(stop).重启(restart).查看状态(status)等.相关的命令还包括chkconfig.ntsysv等,chkcon ...