jquery 的动画列表、jquery的queue、dequeue用法

//1,我首先建议了一个函数数组,里边是一些列需要依次执行的动画
//2,然后我定义了一个回调函数,用dequeue方法用来执行队列中的下一个函数
//3,接着把这个函数数组放到document上的myAnimation的队列中(可以选择任何元素,我只是为了方便而把这个队列放在document上)
//4,最后我开始执行队列中的第一个函数这样做的好处在于函数数组是线性展开,增减起来非常方便。
var FUNC=[
    function() {$(".p1").animate({‘width‘:100},aniCB);},
    function() {$(".p1").animate({height:150},aniCB);},
    function() {$(".p2").animate({‘width‘:500},aniCB);},
    function() {$(".p2").animate({‘height‘:500},aniCB);},
    function() {$(".p1").animate({‘width‘:1000},aniCB);},

];
var aniCB=function() {
    $(document).dequeue("myAnimation");
}
$(document).queue("myAnimation",FUNC);
aniCB();

//清空队列
//$(document).queue("myAnimation",[]);
//加一个新的函数放在最后
$(document).queue("myAnimation",function(){$(".p1").animate({‘width‘:500},aniCB);});
$(document).queue("myAnimation",function(){$(".p2").animate({‘height‘:300},aniCB);});

jquery 的动画列表、jquery的queue、dequeue用法

时间: 2024-10-18 12:13:39

jquery 的动画列表、jquery的queue、dequeue用法的相关文章

jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(selector).stop(stopAll,goToEnd); 可选的 stopAll 参数规定是否应该清除动画队列.默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行. 可选的 goToEnd 参数规定是否立即完成当前动画.默认是 false. 因此,默认地,stop() 会清除在被

jquery的动画学习--jquery权威指南

前面的fadeIn和fadeOut还有fadeTo以及sildeToggle还有sildeUp\sildeDown还有toggle还有show.hide等都经常用,就不再手写了,需要注意的是fadeTo的合理应用,可以规定opactiy的具体数值,另外各个效果的回调函数可以多用用. $("div").click( function(){ $(this).animate({ width:"100px" , height :"100px" },300

jQuery 第五章 实例方法 详解内置队列queue() dequeue() 方法

.queue() .dequeue() .clearQueue() --------------------------------------------------------------------------   .queue() 往队列 里面放东西 参数: .queue([queueName], fuc(next)) queueName: 队列名,字符串形式, 默认是 fx  fuc(next) : 可传函数, 等一系列 值. 他会把你的值, 放到 数组里面. (next) 如果你函数

jquery中动画效果的函数

在jquery中有很多的动画效果,我给大家分享了一下jquery中的动画函数 jQuery的效果函数列表: animate():对被选元素应用“自定义”的动画. clearQueue():对被选元素移除所有排队的函数(仍未运行的). delay():对被选元素的所有排队函数(仍未运行)设置延迟. dequeue():运行被选元素的下一个排队函数. fadeln():逐渐改变被选元素的不透明度,从隐藏到可见. fadeOut():逐渐改变被元素的不透明度,从可见到隐藏. fadeTo():把被选元

jquery的动画效果

序言:昨天复习了jQuery的一些事件,今天我打算继续来复习jQuery的动画效果. 用于写一些网页特效:渐变菜单,渐变显示,图片轮播等. 首先当然得引入插件:<script src="jquery/jquery-1.11.1.js"></script> 1.简单的HTML代码 <input type="button" value="show" id="btn1"/><input ty

jquery自定义动画animate()

<1> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="jquer

jQuery操作动画队列

1.前言 当在jQuery对象上调用动画方法时,如果对象正在执行某个动画效果,那么新调用的动画方法就会被添加到动画队列中,jQuery会按顺序依次执行动画队列的每个动画. jQuery提供了以下几种方法来操作动画队列. 1)        stop([clearQuery],[gotoEnd]):停止当前jQuery对象里每个DOM元素上正在执行的动画. 2)        queue([queueName,]callback):将callback动画数添加到当前jQuery对象里所有DOM元素

16款创建CSS3动画的jQuery插件

jQuery插件是用来扩展jQuery原型对象的方法. 本文搜集了用来为你的网站创建CSS3动画的一些jQuery插件. 1. jQuery Smoove Smoove 简化了CSS3转换效果,使得页面向下滚动时网页内容能有一种滑入的动效. 在线演示:http://wow.techbrood.com/fiddle/7 2. CSS3 Animate it 这个插件效果和Smoove类似. 3. WaitMe WaitMe 是用于创建加载CSS3动画的 jQuery 插件. 4. Stroll.j

jQuery源码05 (3653 , 3797) queue() : 队列方法 : 执行顺序的管理

//对外接口 jQuery.extend({ queue: function( elem, type, data ) {//入队.元素.队列名字.存进去的函数 //jQuery.queue( this, type, function( next, hooks ) {}) var queue; if ( elem ) { type = ( type || "fx" ) + "queue";//不写队列名字就是fx // $.queue( document , 'q1'