建議學(xué)習(xí)時(shí)長(zhǎng)： 30分鐘
學(xué)習(xí)方式：了解
學(xué)習(xí)目標(biāo)
- 知道淡入淡出和展開(kāi)合攏的方式顯示/隱藏元素的寫法
- 知道動(dòng)畫的通用寫法
詳細(xì)介紹
淡入淡出的方式的顯示/隱藏元素
$el.fadeIn() // 顯示
$el.fadeOut() // 隱藏
展開(kāi)合攏的方式顯示/隱藏元素
$el.slideDown() // 顯示
$el.slideUp() // 隱藏
通用動(dòng)畫
寫法:
.animate( 屬性 [, 持續(xù)事件 ] [, 緩動(dòng)函數(shù)名 ] [, 動(dòng)畫完成后的回調(diào) ] )
如
$el.animate({
opacity: 0.6,
left: '+=50',
height: 'toggle'// 0 與 原高的切換
}, 2000, function(){
// 動(dòng)畫完成
})
上面的的代碼的意思是：元素以動(dòng)畫的方式經(jīng)過(guò) 2 秒，透明度變成 0.6,向左移 50。
