show()、hide()、fadeIn()、fadeOut()、slideDown、slideUp、slideToggle()都接受可选的时长和回调参数（选项对象参数）。
toggle(duration,callback)
toggle(condition)传入true和不带参数调用show()是一样的，传入false则和不带参数调用hide()是一样的。
fadeTo()会将元素的当前opacity值变化的目标值，第一参数必须是时长，第二参数是opacity目标值，第三参数是回调函数。
时长：字符串"fast"表示200ms,字符串"normal"表示400ms,字符串"slow"表示600ms。默认为400ms。
jQuery.fx.speeds["medium-fast"]=300;
jQuery.fx.speeds["medium-slow"]=500; //改变默认定义的时长
animate(properties,duration,easing,callback);
animate(properites,options);
在animate()中可以使用"toggle"来实现显示或隐藏。
options参数：duration属性，complete属性（在动画完成时的回调函数），step属性（指定在每一步或每一帧调用的回调函数），queue属性（指定动画是否需要队列化），easing属性。
queue属性：设置为false可以取消默认的队列化，非队列化的动画会立即执行。随后队列化的动画不会等待非队列化的动画执行完成后才执行。
$('img').fadeIn(500).animate({'width':'+=100'},{queue:false,duration:1000}).fadeOut(500);
//改变width属性是非队列化的，这段width动画和fadeIn()效果的开始时间相同。fadeOut()效果会在fadeIn()效果完成时立刻开始，它不会等到width动画完成。
easing属性：指定缓动函数名，jQuery默认使用的是命名为"swing"的正弦函数。
stop([clearQueue][,gotoEnd])方法：
1.如果直接使用不带参数的stop()方法，则会立即停止当前正在进行的动画，如果接下来还有动画等待继续进行，则以当前状态开始接下来的动画，可以用在不想让元素被用户连续触发，动画不断传入队列的情况。
$(function(){
$("#panel").hover(function() {
$(this).stop().animate({height : "150",width : "300"} , 200 );
},function() {
$(this).stop().animate({height : "22",width : "60" } , 300 );
});
});
2.stop(true)：若不使用参数在下面这种情况下就会出问题。
$(function(){
$("#panel").hover(function() {
$(this).stop()
.animate({height : "150" } , 200 ) //如果此时触发了光标移出的事件，将不执行2处的动画，而会执行3处的动画。
.animate({width : "300" } , 300 ) //3
},function() {
$(this).stop()
.animate({height : "22" } , 200 ) //2
.animate({width : "60" } , 300 )
});
});
//解决方法：传入true在stop()，此时程序会把当前元素接下来尚未执行完的动画队列都清空。
3.stop(false,true)：可以用于让正在执行的动画直接到达结束时刻的状态，通常用于后一个动画需要基于前一个动画的末状态的情况。
4.stop(true,true)：停止当前动画直接到达当前动画的末状态，并清空动画队列。
注：jQuery只能设置正在执行的动画的最终状态，而没有提供直接到达未执行动画队列最终状态的方法。
delay(duration[,name])：延迟命名队列中下一个函数的执行，在下一个函数执行之前会停顿一段时间。（省略name则默认为特效队列名称fx）
queue()、dequeue()、clearQueue()队列相关方法
queue(name)：根据传入的名称查找建立在匹配集中的第一个元素上的任意队列，并以函数数组形式返回。
queue(name,function)：将传入的函数添加到匹配集中的所有元素的命名队列（name参数）的末尾。如果在某个元素上不存在这种命名队列，则创建一个队列。
queue(name,queue)：把匹配元素上现有的任意队列替换为传入的队列。（参数name表示需要替换的队列名称。参数queue表示一个函数数组,用于替换命名队列中的现有函数）
dequeue(name)：删除匹配集中每个元素的命名队列中的第一个函数（最先传入的函数），并为每个元素执行此函数。（省略name则默认为特效队列名称fx）
clearQueue(name)：从命名队列中删除所有未执行的函数。（省略name则默认为特效队列名称fx）
注：队列函数queue()中的回调函数是jQuery1.4引入的新特性，可以用next()方法来连接以运行队列中的下一项，当然也可以调用dequeue()方法。
$('message').fadeIn().delay(200).queue(function(text){
$(this).text('Hello World');
next(); //运行队列中的下一项
}).animate({borderWidth:'+=10px;'});
//也可以调用dequeue()方法
$('message').fadeIn().delay(200).queue(function(text){
$(this).text('Hello World');
$(this).dequeue(); //替代next()方法
}).animate({borderWidth:'+=10px;'});
动画队列顺序总结：
1.对于一组元素上的动画，当在一个animate()方法中应用多个属性时，动画是同时发生的。当以链式的写法应用动画方法时，动画是按照顺序发生的。
2.当以回调的形式应用动画方式时，动画是按照回调顺序发生的。
代码片段集
//example1
$('img').animate({
opacity:.25,
font-size:10,
width:'hide',
borderLeft:'hide',
borderRight:'hide',
paddingLeft:'hide',
paddingRight:'hide' //可以实现'slideRight'效果（动画内容是元素宽度）
},{
duration:400,
complete:function(){
this.text('Goodbye');
},
queue:true,
easing:swing
}
//example2
////jQuery动画框架允许为不同的CSS动画属性指定不同的缓动函数。
//第一种方式，使用specialEasing选项
$('img').animate({
width:'hide',
height:'hide',
opacity:'hide'
},{specialEasing:{
width:'linear',
height:'linear'
}
}
); //第二种方式，在第一个对象参数中传入[目标值,缓动函数] 数组
$('img').animate({
width:['hide','linear'],
height:['hide','linear'],
opacity:'hide'
});
//example3
//自定义缩放动画
$('.animateMe').each(function(){
$(this).animate({
width:$(this).width()*2,
height:$(this).height()*2
},2000);
});
//example4
//自定义掉落动画
$('.animateMe').each(function(){
$(this).css('position','relative').animate({
opacity:0,
top:$(window).height()-$(this).height()-$(this).position().top //注意这里是$(window)
},'slow',function(){$(this).hide();}
);
});
//example5
//自定义消散动画
$('.animateMe').each(function(){
var position=$(this).position();
$(this).css({
position:'absolute',
top:position.top,
left:position:left
}).animate({
opacity:'hide',
width:$(this).width()*4,
height:$(this).height()*5,
top:position.top-($(this).height()/2*4),
left:position.left-($(this).width()/2*4)
},'normal');
});