需求描述:我需要对不懂的两个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. JPA-day02 项目结构 编写增删改查测试类

  2. idea | SpringBoot项目热加载

    第一步: 在pom文件添加依赖: <dependency> <groupId>org.springframework.boot</groupId> <arti ...

  3. idea | gitee 码云

    https://blog.csdn.net/qq_32340877/article/details/81205547

  4. djangoXadmin

    是一个基于admin二次开发的开源组件,但是貌似已经停止开发了. 安装方式:(py3.6,django2.1) 1 先用pip安装xadmin2,它会安装xadmin和一些依赖包 2 用pip卸载xa ...

  5. wmq的队伍 BIT优化dp

    http://oj.xjtuacm.com/problem/14/ wmq的队伍 发布时间: 2017年4月9日 17:06   最后更新: 2017年4月9日 17:07   时间限制: 2000m ...

  6. MySQL简单的确定瓶颈

    如果接到报警可能需要ssh看看瓶颈是什么,怎么下手 确定os层 确定磁盘是否够用的:df –h 再看看系统整体状态: top 哪些进程占用资源比较多,能杀就杀 系统的负载 vmstat看看wa值,r列 ...

  7. php设计模式学习之工厂模式

    我的认为:所为工厂模式是事先有一系类class,一个工厂类' 工厂类根据不同的参数创建不同的对象,调用各自的方法; php利用工厂模式实现计算器: ?php /** * Created by PhpS ...

  8. Bluefish

    Bluefish标榜其自身是“一款为熟练的Web设计员和程序员而设的编辑器,但它的UI却很直观,任何初学者都能够很快上手,并在不断地积累中发现和掌握它的其它功能.   Bluefish标榜其自身是“一 ...

  9. 09通过winfrom实现简单的播放音、视频

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  10. I/O————字节流

    InputStream字节输入流 OutputStream字节输出流 用于以字节的形式读取和写入数据 下面是使用 字节输入流读取文件字节输出流写入文件 文件可能不存在,所以使用try catch pu ...