jQuery animate是一種動畫方法,它可以讓元素從起始位置移動到目的位置。jquery animate有很多參數(shù),使得動畫更加流暢和有趣。
//這是一個很基本的jQuery animate $('div').animate({ left:'250px', opacity:'0.5', height:'150px', width:'150px' });
上面這個例子會使一個div元素形成動畫效果,沿著X軸移動250像素(左邊距為0),高和寬都變成150像素,透明度降低至0.5。
//這是一個更高級的jQuery animate示例 $('div').animate({ left:'+=250px', height:'toggle', opacity:'0.5' }, "slow", function() { alert("動畫完成"); });
這個例子將會更加復(fù)雜。當(dāng)div元素被點(diǎn)擊時,它會沿著X軸向右移動250像素,高度會從0變?yōu)樵几叨龋╰oggle選項(xiàng)),透明度將變成0.5。動畫完成時,屏幕將彈出一個alert(動畫完成)。
jQuery animate還有其他一些參數(shù)。例如,您可以使用easing參數(shù)來指定動畫類型(勻速、緩慢等等),duration參數(shù)用于指定動畫持續(xù)時間,queue參數(shù)用于指定是否先執(zhí)行當(dāng)前動畫,然后再執(zhí)行下一個動畫或者在當(dāng)前動畫完成時馬上啟動下一個動畫。
簡而言之,jQuery animate是一個非常強(qiáng)大和有趣的工具,可以用于優(yōu)化您的網(wǎng)頁動畫。