Jquery 自定义动画同步进行如何实现?
需求描述:我需要对不懂的两个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 自定义动画同步进行如何实现?的更多相关文章
- js进阶 13-4 jquery自定义动画animate()如何使用
js进阶 13-4 jquery自定义动画animate()如何使用 一.总结 一句话总结:animate(params,[speed],[easing],[fn]),参数:params:一组包含作为 ...
- 深入学习jQuery自定义动画
× 目录 [1]属性对象 [2]可选参数 [3]选项参数 前面的话 很多情况下,前面介绍的jQuery动画的简单效果无法满足用户的各种需求,那么就需要对动画有更多的限制,需要采取一些高级的自定义动画来 ...
- jQuery 自定义动画效果
<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js&qu ...
- Jquery自定义动画与动画队列
animate:自定义动画 $(selector).animate({params},[speed],[easing],[callback]); params:要执行动画的css属性,它是一个对象可以 ...
- jQuery——自定义动画
动画方法:animate(json,1000, function (){}) 参数说明:json代表属性设置,1000是动画时间,最后一个是回调函数,其中动画时间可选 属性支持:http://www. ...
- jQuery自定义动画
$(function(){ $(".btn1").click(function(){ $(','opacity':'toggle'}); }); $(".btn2&quo ...
- python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax
一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...
- jQuery Easing动画效果扩展(转)
jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...
- jQuery Easing 动画效果扩展
jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...
随机推荐
- [题解](最短路)luogu_P5122 Fine Dining
首先理解这里的美味值相当于给你更多时间让你经过这个草垛的, 也就是在经过草垛时可以给你的时间减少w[i],这样能否比最短路不慢 然而我们并不容易知道怎么走才是最好的,所以要想办法避免找这个方案 我们新 ...
- ZOJ3329(数学推导+期望递推)
要点: 1.期望的套路,要求n以上的期望,则设dp[i]为i分距离终点的期望步数,则终点dp值为0,答案是dp[0]. 2.此题主要在于数学推导,一方面是要写出dp[i] = 什么,虽然一大串但是思维 ...
- python入门之实例-购买商品
需求: 选择商品,结算所选的商品 #目前总资产 asset_all = 0 #所选商品总价 all_price = 0 #购物车列表,目前已选择商品 #每个元素的结构:"商品名": ...
- Win10系统特别卡的一个原因
我遇到的Win10特别卡的原因是它自带的一个杀毒软件 迈克菲(McAfee)导致的,在卸载之前电脑真的特别卡,打开一个窗口都卡,,卸载了之后瞬间感觉电脑飞起来了.... 当然还有很多原因会导致电脑卡, ...
- Leetcode 题解 - 目录
本文从 Leetcode 中精选大概 200 左右的题目,去除了某些繁杂但是没有多少算法思想的题目,同时保留了面试中经常被问到的经典题目. 算法思想 双指针 排序 贪心思想 二分查找 分治 搜索 动态 ...
- Vue 简单实用---代码可以直接用
<!DOCTYPE html> <html> <head> <title></title> <script src="htt ...
- Spring Boot常用配置
概述 本文主要写了下Spring Boot的一些常用配置. Spring Boot基本配置 入口类: Spring Boot通常有一个名为*Application的入口类,入口类里面有一个main方法 ...
- leetcode166 Fraction to Recurring Decimal
思路: 模拟. 实现: class Solution { public: string fractionToDecimal(int numerator, int denominator) { long ...
- VUE学习,vue运行环境搭建遇见的小问题
1.使用vscode来编辑项目,那么首先给它搭一个vue运行的环境,打开集成终端,使用npm install live-server -g安装live-server. problem1:cmd终端分行 ...
- socket使用非阻塞connect
在使用tcp的connect调用时,默认是使用阻塞方式,当服务器当前不可用时,connect会等待(内部在重试?)直到超时时间到达,而这个超时时间是系统内核规定的,不能使用setSocketOpt来设 ...