第六章 《jQuery动画效果》

　　该章节主要罗列jQuery里面的动画效果。

　　1 .show([duration][,callback]);

　　该方法主要用于显示对象 duration是指显示对象的执行时间（毫秒），callback是指显示完成后执行的方法

　　1).show();//直接显示对象

　　2).show(200,function(){alert("显示完成");});

　　2.hide([duration][,callback]);

　　该方法主要用于隐藏对象  参数以及使用方法与.show()一致

　　3.toggle()

　　切换对象显示与隐藏

　　1).toggle() //切换显示与隐藏

　　2).toggle(boolean)根据bool值去执行显示与隐藏 true:显示 false:隐藏

　　3).toggle([duration][,callback]);

　　4.fadeIn([duration][,callback]);

　　淡入效果，慢慢的显示对象

　　5.fadeOut([duration][,callback]);

　　淡出效果，慢慢隐藏对象

　　6.fadeTo(duration,opacity[,callback]);

　　调整对象透明度  其中duration 是设置动画的时间，opacity是设置透明度0-1，callback是动作执行完后执行的方法

　　例:

　　$("#div1").fadeTo(2000,0.5,function(){alert("执行完毕");});

　　7.slideDown([duration][,callback]);

　　向下滑动显示出隐藏的对象

　　8.slideUp([duration][,callback]);

　　向上滑动隐藏对象

　　9.sildeToggle([duration][,callback]);

　　切换滑动显示与隐藏对象

　　10.animate(properties[,duration][,easing][,callback]);

　　.animate(properties,options);

　　自定义动画 其中properties是一个包含CSS样式目标值的映射，duration是执行动画指定的时间，easing是值进行缓动的方式（在后面会介绍），callback是执行完动画后会调用的方法

　　options是Map类型 可以给amimate方法传递 duration、easing、callback等参数

　　例：

　　$("#div1").animate({"68%",opacity:0.4,marginLeft:"0.6in",fonSize:"3em",borderWidth:"10px;"},1500);

　　$("#div1").animate({opacity:0.25,left:"+=50",height:"toggle"},5000,function(){alert("执行完毕!");});

　　注：在使用left属性时需要将对象div1进行相对或绝对定位, 这里的 toggle是指 第一次将高度 变为0  第二次将高度还原。而left会每次增加50

　　11.queue()

　　该方法用于管理动画队列

　　1).queue([queueName]);用于获取该对象的  执行函数长度 其queueName是指队列名称的字符串

　　例：

　　$("#div1").slideUp().fadeIn();

　　var n=$(#div1).queue("fx");//获取该对象的执行函数队列

　　n.length// 2 函数长度（数量）

　　$("#div1").queue("fx",[]);//清空该对象的执行函数

　　$("#div1").queue(function(){ //像该对象附加一个执行函数

　　　　$(this).toggleClass("red");

　　　　$(this).dequeue();　　//对当前匹配元素执行下一个函数,目的是为了保证函数队列可以继续移动。

　　});

　　12.delay()

　　该方法用于延迟函数队列中的后续函数

　　例:

　　$("#div1").slideUp(300),delay(5000),fadeIn(400);

　　13.clearQueue()

　　该方法是指从函数队列中移除所有尚未执行的函数

　　例:

　　$("#div1").clearQueue();

　　14.stop([clearQueue][,jumpToEnd])

　　 该方法用于停止匹配元素当前正在运行的动画

　　其中：clearQueue 是一个bool值  指是否在停止动画的同时清除动画队列默认值为false不清空,jumpToEnd也是一个bool值指示是否立即完成当前动画，默认值为false

　　例：

　　$("#div1").stop();

　　$("#div1").stop(true,true);

　　15 .off属性

　　off属性是全局jQuery对象的一个属性，可用与禁止所有动画。

　　语法:jQuery.fx.off 该属性为bool值  若设置为true 则将立即完成所有动画到目标状态，而不会显示任何效果.

　　若设置为false 则还可以重新运行动画效果.

　　例:$.fx.off=true;