<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://wwww.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
1.show(speed [,callback])/hide(speed [,callback]);
会改变元素的高度、宽度和不透明度，不带参数的情况下，相当于 $("element").css("display":"none/block/inline"); 作用是立即隐藏或显示匹配的元素，不会有任何动画
该效果适用于通过 jQuery 隐藏的元素，或在 CSS 中声明 display:none 的元素（但不适用于 visibility:hidden 的元素）
可以为show()/hide()指定一个速度参数和回调函数
show("slow")=show(600) // 元素将在600毫秒内慢慢地显示出来
show("normal")=show(400) // 元素将在400毫秒内慢慢地显示出来
show("fast")=show(200) // 元素将在200毫秒内慢慢地显示出来,从上到下增加高度，从左到右增大宽度，同时增加不透明度
hide(600); // 同时减少高度、宽度和不透明度，直到这3个属性的值都为0，最后设置该元素的CSS规则为"display: none"
只改变元素的不透明度，也可以指定速度参数(slow, normal, fast)和回调函数
该效果适用于通过 jQuery 隐藏的元素，或在 CSS 中声明 display:none 的元素（但不适用于 visibility:hidden 的元素）
fadeOut(); //在指定的一段时间内降低元素的不透明度，直到元素完全消失("display: none")
fadeIn(); //与fadeOut() 相反只改变元素的高度，也可以指定速度参数(slow, normal, fast)和回调函数
该效果适用于通过 jQuery 隐藏的元素，或在 CSS 中声明 display:none 的元素（但不适用于 visibility:hidden 的元素）
slideDown(); //为由上至下延伸显示
slideUp(); //为由下至上缩短隐藏4.自定义动画方法animate()
animate(params [, speed] [,easing] [, callback]); 可以用来代替所有的动画
params: 一个包含样式属性及值的映射，比如{property1:"val1", property2:"val2"...}， 可设置的属性有：
left, right, top, bottom height, width, maxWidth, minWidth, maxHeight, minHeight font, fontSize
margin, marginLeft, marginRight, marginTop, marginBottom padding, paddingLeft, paddingRight, paddingTop, paddingBottom
borderWidth, borderLeftWidth, borderRightWidth, borderTopWidth, borderBottomWidth, borderSpacing
outlineWidth, backgroundPosition, letterSpacing, wordSpacing lineHeight, textIndent
speed: 速度参数，可选
easing: (默认值: "swing") 要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".
callback: 在动画完成时执行的函数，可选
该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。
只有数字值可创建动画（比如 "margin:30px"）。字符串值无法创建动画（比如 "background-color:red"）
$("p").animate({ height: 'toggle', opacity: 'toggle'}, "slow"); //在600毫秒内切换段落的高度和透明度
$(this).animate({left: "500px"}, 3000); //使元素在3s内向右移动500像素
$(this).animate({left: "+=500px"}, 3000); //累加动画，"+="或"-="
$(this).animate({left: "+=400px", height: "+=200px", opacity:"1"}, 3000); //多重动画，这些动画会同时发生的，如果需要按顺序执行，拆开写就行了
$(this).animate({top:"200px", width:"200px"}, 3000, function(){
$(this).css("border", "5px solid blue");
}) //使用回调函数对非动画方法进行排队，否则非动画方法会立即执行，不会等待动画结束后才执行
.fadeOut("slow");animate(params, options) 另外一种形式
params: 一组包含作为动画属性和终值的样式属性和及其值的集合
options: 一组包含动画选项的值的集合。
duration: ("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000)
easing: (默认值: "swing") 要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".
complete: 在动画完成时执行的函数
step: callback
queue: (默认值: true) 设定为false将使此动画不进入动画队列 (jQuery 1.2中新增)
$("p").animate({height: 'toggle', opacity: 'toggle'}, { duration: "slow" }); //用600毫秒切换段落的高度和透明度
$("p").animate({left: 50, opacity: 'show'}, { duration: 500 }); //用500毫秒将段落移到left为50的地方并且完全清晰显示出来（透明度为1）
$("#block1").animate( { width: "90%"}, { queue: false, duration: 5000 } ); //不进入动画队列stop([clearQueue][, gotoEnd]);停止所有在指定元素上正在运行的动画
clearQueue: 是否要清空未执行的动画队列gotoEnd: 是否直接将正在执行的动画跳转到末状态
//如果直接使用stop()方法，则会立即停止当前正在进行的动画，如果接下来还有动画等待继续进行，则以当前状态形开始接下来的动画，如果是动画队列，stop方法就不够用了，这时就需要传递参数。
$("#panel").hover(function(){
$(this).stop()
.animate({height:"150", width:"300"}, 200);
}, function(){
$(this).stop()
.animate({height:"22", width:"60"}, 300);
});注意： jQuery只能设置正在执行的动画的最终状态，而没有提供直接到达未执行动画队列最终状态的方法
delay(duration, [queueName]) 设置一个延时来推迟执行队列中之后的项目。queryName是队列名词，默认是Fx，动画队列。
$('#foo').slideUp(300).delay(800).fadeIn(400); 在.slideUp() 和 .fadeIn()之间延时800毫秒。if(!$("element").is(":animated")){
//如果当前没有进行动画，则添加新动画
}5.其它动画方法
toggle(speed [, callback] [,switch]); //切换元素的可见状态，hide() 和 show() 方法的结合，switch为true时全部都可见，为false时全部都隐藏
$("#panel h5.head").click(function(){
$(this).next("div.content").toggle();
});
$("p").toggle("fast",function(){
alert("Animation Done.");
});
slideToggle(speed [, callback]); //通过高度变化来切换匹配元素的可见性，只调整元素的高度，slideUp() 和 slideDown() 的结合
$("#panel h5.head").click(function(){
$(this).next("div.content").slideToggle();
});
$("p").slideToggle("fast",function(){
alert("Animation Done.");
});
fadeTo(speed, opacity [, callback]); //把元素的不透明度以渐进方式调整到指定的值，只调整元素的不透明度，宽度和高度不会发生变化
$("#panel h5.head").click(function(){
$(this).next("div.content").fadeTo(600, 0.2);
});
$("p").fadeTo("fast", 0.25, function(){
alert("Animation Done.");
});
6.关闭页面上所有动画
jQuery.fx.off = true;
把这个属性设置为true可以立即关闭所有动画(所有效果会立即执行完毕)。有些情况下可能需要这样，比如：
* 你在配置比较低的电脑上使用jQuery。
* 你的一些用户由于动画效果而遇到了 可访问性问题
当把这个属性设成false之后，可以重新开启所有动画。