对非动画的实现排队,比如这个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. VMware上安装VMware tools

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/walkerkalr/article/details/34896407  VMware上安装VMw ...

  2. iframs刷新的两种方法

    <iframe src="a1.html" id="iframe1Id" name="iframe1Name" width=" ...

  3. 使用Navicat导入excel表

    1:首先创建Navicat与数据库的连接 2:,从数据库中选择要导入的表 3:导入向导,选择要导入的数据类型 4:创创建excel表:一般第一行需要与表的属性相对应,这样就不需要手动设置对应栏位 不一 ...

  4. HDU5012:Dice(bfs模板)

    http://acm.hdu.edu.cn/showproblem.php?pid=5012 Problem Description There are 2 special dices on the ...

  5. 使用feof()判断文件结束时会多输出内容的原因

    这是原来的代码: #include <stdio.h>int main(){    FILE * fp;    int ch;    fp = fopen("d:\\aaaaa\ ...

  6. js删除逗号

    var aaa="123,432,34.00 aaa.replace(/,/g, '');

  7. <Convolutional Neural Network for Paraphrase Identification>

    code:https://github.com/chantera/bicnn-mi Yin的这篇论文提出了一种叫Bi-CNN-MI的架构,其中Bi-CNN表示两个使用Siamese框架的CNN模型:M ...

  8. IN的另类写法

    EXPLAIN SELECT * FROM `tcb_capital_log` WHERE id IN(66,79,47) EXPLAIN SELECT * FROM ( SELECT 66 AS i ...

  9. Spring,Struts2,MyBatis,Activiti,Maven,H2,Tomcat集成(一)——Maven,Tomcat,Spring集成

    1.  创建Maven Web工程 (1)       磁盘上创建Maven工程所需要的文件夹结构如下: (2)       在与src同级目录中创建pom.xml文件: <project xm ...

  10. Hive 复制分区表和数据

    1. 非分区表: 复制表结构: create table new_table as select * from exists_table where 1=0; 复制表结构和数据: create tab ...