jQuery(七)、效果和動畫

1 顯示和隱藏

　　1、show([speed,[easing],[fn]])

　　顯示隱藏的匹配元素。

　　參數：

　　(1) spend：三種預定速度之一的字元串('show','normal','fast')或表示動畫時長的毫秒數值

　　(2) easing：用來指定切換效果，預設為swing,可用參數linear

　　(3) fn：在動畫完成時執行的函數，每個元素執行一次

　　2、hide([speed,[easing],[fn]])

　　隱藏顯示的元素。

2 滑動

　　1、slideDown([speed,[easing],[fn]])

　　通過高度變化(向下增大)來動態地顯示所有匹配的元素，在顯示完成後可選地觸發一個函數。

　　2、slideUp([speed,[easing],[fn]])

　　通過高度變化(向下減小)來動態地隱藏所有匹配的元素，在隱藏完成後可選地觸發一個函數。

　　3、slideToggle([speed,[easing],[fn]])

　　通過高度變化來切換所有匹配元素的可見性(顯示、隱藏)，在顯示或隱藏完成後可選地觸發一個函數。

3 淡入淡出

　　1、fadeIn([speed,[easing],[fn]])

　　通過透明度的變化來實現所有匹配元素的淡入效果，併在動畫完成後可選地觸發一個函數。

　　2、fadeOut([speed,[easing],[fn]])

　　通過透明度的變化來實現所有匹配元素的淡出效果，併在動畫完成後可選地觸發一個函數。

　　3、fadeTo([speed,opacity,[easing],[fn]])

　　把所有匹配元素的透明度以漸進方式調整到指定透明度，併在動畫完成後可選地觸發一個函數。

　　參數：

　　(1) opacity： 0 ~ 1之間表示透明度的數字。

　　4、fadeToggle([speed,[easing],[fn]])

　　通過透明度的變化來切換 所有匹配元素的淡入和淡出效果，併在動畫完成後可選地觸發一個函數。

4 自定義動畫

　　1、animate(params[, spend] [,easing][, fn])

　　用於創建自定義動畫。

　　該函數的關鍵在於指定動畫形式及結果樣式屬性對象params。所有指定的屬性必須用駝峰形式，比如marginTop代替margin-top。

　　參數：

　　(1) params：一組包含作為動畫屬性和終值樣式屬性和值得集合。如：{width:'90%',height:'90%',borderWidth:10}

// 每次向右移動50px
$("#right").click(function(){
  $(".block").animate({left: '+50px'}, "slow");
});

　　2、stop([clearQueue], [jumpToEnd])

　　停止所有在指定元素上正在運行的動畫。

　　如果隊列中有等待執行的動畫(並且clearQueue沒有設為true)，將馬上執行所有動畫。

　　參數：

　　(1) clearQueue：如果設置為true，則清空動畫執行隊列。可以立即結束動畫。

　　(2) jumpToEnd：如果設置為true，則立即執行完動畫隊列。

5 設置

　　1、jQuery.fx.off

　　關閉頁面上所有的動畫。

　　2、jQuery.fx.interval

　　設置動畫的顯示幀速。