需求描述:我需要对不懂的两个HTML对象进行操作,同时开始动画,同时结束动画。

遇到问题:如果先后对连个对象进行 animate动画,那么第一个会先运行,等第一个运行完了运行第二个,这样就不同步了。

解决方法:使用 setTimeout(),每一个延时执行的方法是不会相互干预的。

代码

------------------------------------------------------------------

对一个HTML对象修改一种属性

$('#box').animate({height:400},500)

对一个HTML修改两种属性

$('#box').animate({height:400},500).animate({width:400},500);  //分先后执行
$('#box').animate({height:400,width:400},500);//同时执行

对多HTML对象修改多种属性

setTimeOut(fa,1000)
setTimeOut(fb,1000)
setTimeOut(fc,1000)
setTimeOut(fd,1000) function fa(){
   $('#a').animate({height:400},500)
}
function fb(){
 $('#b').animate({height:400},1000)
}
function fc(){
 $('#c').animate({width:400},1000)
}
function fd(){
 $('#d').animate({width:400},800)
}

个人博客地址:http://blog.wxp123.me/  Jquery 自定义动画同步进行如何实现?

Jquery 自定义动画同步进行如何实现?的更多相关文章

  1. js进阶 13-4 jquery自定义动画animate()如何使用

    js进阶 13-4 jquery自定义动画animate()如何使用 一.总结 一句话总结:animate(params,[speed],[easing],[fn]),参数:params:一组包含作为 ...

  2. 深入学习jQuery自定义动画

    × 目录 [1]属性对象 [2]可选参数 [3]选项参数 前面的话 很多情况下,前面介绍的jQuery动画的简单效果无法满足用户的各种需求,那么就需要对动画有更多的限制,需要采取一些高级的自定义动画来 ...

  3. jQuery 自定义动画效果

    <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js&qu ...

  4. Jquery自定义动画与动画队列

    animate:自定义动画 $(selector).animate({params},[speed],[easing],[callback]); params:要执行动画的css属性,它是一个对象可以 ...

  5. jQuery——自定义动画

    动画方法:animate(json,1000, function (){}) 参数说明:json代表属性设置,1000是动画时间,最后一个是回调函数,其中动画时间可选 属性支持:http://www. ...

  6. jQuery自定义动画

    $(function(){ $(".btn1").click(function(){ $(','opacity':'toggle'}); }); $(".btn2&quo ...

  7. python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax

    一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...

  8. jQuery Easing动画效果扩展(转)

    jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...

  9. jQuery Easing 动画效果扩展

    jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...

随机推荐

  1. Zynq7000开发系列-6(QT开发环境搭建:Ubuntu、Zynq)

    操作系统:Ubuntu14.04.5 LTS 64bit Qt:Qt 5.4.2 (qt-opensource-linux-x64-5.4.2.run.qt-everywhere-opensource ...

  2. Tinghua Data Mining 5

    ID3 ID3算法倾向于分的很细的变量 C4.5加入分母为惩罚量

  3. [洛谷3935]Calculating

    题目链接:https://www.luogu.org/problemnew/show/P3935 首先显然有\(\sum\limits_{i=l}^rf(i)=\sum\limits_{i=1}^rf ...

  4. 部署iis服务器与c#程序遇到的问题小结

    记得上次部署IIS服务器比较顺利,半天搞定的?有点忘了. 但,服务器版本各有不同,这次装的是server2008 R2 Ennterprice版.虽然忘了上次装的是哪个版本,但进去后发现有些东西明显不 ...

  5. Bridges Gym - 100712H  无向图的边双连通分量,Tarjan缩点

    http://codeforces.com/gym/100712/attachments 题意是给定一个无向图,要求添加一条边,使得最后剩下的桥的数量最小. 注意到在环中加边是无意义的. 那么先把环都 ...

  6. Help with Intervals(集合的交并补,线段树)

    很早以前做过这题,早就没印象了,估计当时也是照着某大神的代码抄过的,现在是连题意都看了好长时间. 刚开始的S集合是空集,给你一些操作和一个T集合,把操作的结果再赋给S集合. 解法:因为会有开区间和闭区 ...

  7. zuul filter

    前言 过滤器是Zuul的核心组件,这篇文章我们来详细讨论Zuul的过滤器.下面话不多说,来看看详细的介绍吧. 过滤器类型与请求生命周期 Zuul大部分功能都是通过过滤器来实现的.Zuul中定义了四种标 ...

  8. Notepad++设计Tab制表符为4个空格

    Notepad++中,常常需要将一个Tab制表符转换成4个空格.这种情况大多发生在对空白检查严格的情况下,比如Python程序. 设置 → 首选项 → 制表符设置 → 勾选“ 转换为空格 ”.

  9. 异步 BeginInvoke

    委托的异步调用异步多线程的三大特点:1.同步方法卡界面,原因是主线程被占用:异步方法不卡界面,原因是计算交给了别的线程,主线程空闲2.同步方法慢,原因是只有一个线程计算:异步方法快,原因是多个线程同事 ...

  10. vba 两个表 信息合体一个表格

    1 把Excel某一区域的内容读入到数组中: Dim strArray() As Variant Dim wk_data As Variant Set wk_data = Sheets("S ...