<!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之後，可以重新開啓所有動畫。