jQuery -動畫 jQuery動畫分為三個部分，非自定義動畫，自定義動畫，和全局動畫設置。 一、非自定義動畫： 1.顯示、隱藏： show( ) 、hide( )、toggle() 兩種用法：1）不傳參數，代表直接顯示隱藏。 2） 向方法中傳遞一個參數，這個參數為number類型，代表動畫的執行 ...
jQuery -動畫
jQuery動畫分為三個部分，非自定義動畫，自定義動畫，和全局動畫設置。
一、非自定義動畫： 1.顯示、隱藏： show( ) 、hide( )、toggle() 兩種用法：1）不傳參數，代表直接顯示隱藏。 2） 向方法中傳遞一個參數，這個參數為number類型，代表動畫的執行時間。會有顯示隱藏的動畫效果。 示例:show(100)、hide(100)、toggle(100) 除此之外，jQuery還為動畫方法提供了三種字元串形式的參數：fast、slow、和空字元串'' 示例:show('fast')、hide('slow')、toggle('') 三種參數的執行時間分別為 ：'fast' ：200毫秒 ''(預設值):400毫秒 'slow'：600毫秒 2.滑動： slideUp()：向上滑動（隱藏） slideDown():向下滑動（顯示） slideToggle()：滑動（自動） 3.淡入淡出： fadeOut():淡出（隱藏） fadeIn():淡入（顯示） fadeToggle():顯示隱藏（）自動 fadeTo()，該方法接受兩個參數。 參數1是動畫執行的時間，參數2是期望達到的透明度。 二、自定義動畫 animate()方法 animate()方法有三個參數。分別是動畫目標(target),動畫執行時間，回調函數。只有第一個參數是必填參數。 animate()方法的使用： 將元素屬性變換為自定義動畫中的目標屬性，所有參數中的屬性一起改變。
animate({ 'width':'200px'， 'height':'200px' })
設置的屬性，支持運算。
animate({ 'width':'+=200px' })
如果想要動畫按照順序執行（執行完第一個動畫之後，再執行下一個動畫）有三種方法：
1）藉助動畫的回調函數（操作不同元素的時候，推薦使用回調函數）
$('input').click(function(){
$('div').animate({
'width':'400px',
'height':'400px',
},function(){
$('div').animate({
'width':'200px',
'height':'200px'
})
})
})
2）將動畫效果分開寫
$('input').click(function(){
$('div').animate({
'width':'400px',
'height':'400px',
})
$('div').animate({
'width':'200px',
'height':'200px'
})
})
3）連綴（操作同一元素的時候，推薦使用連綴）
$('input').click(function(){
$('div').animate({
'width':'400px',
'height':'400px',
}).animate({
'width':'200px',
'height':'200px'
})
})
三、動畫及相關方法
1.stop()方法 這個方法是停止動畫的方法，他有兩個參數，都是布爾值。 參數1：代表是否清除動畫隊列；參數2：代表是否直接運行到最後結果 2.delay()方法 延時執行，該方法有一個參數，是延時執行的毫秒數。 3.動畫的遞歸$('div').slideToggle(2000,recursion)
function recursion(){
$(this).slideToggle(2000,recursion)
}
附贈個高級寫法：
$('div').slideToggle(2000,function(){
$(this).slideToggle(2000,arguments.callee)
})
//arguments.callee：常用在匿名函數中， 代表當前的函數。
jQuery的動畫，以上。
