jQuery動畫

自定義動畫
	animate()它能夠實現任意動畫效果,參數:是DOM元素最終的CSS狀態和時間,jQuery在時間段內不斷調整CSS直到達到咱們設定的值
	
	var div = $('#test-animate');
	div.animate({
		opacity: 0.25,
		width: '256px',
		height: '256px'
	}, 3000); // 在3秒鐘內CSS過渡到設定值	


串行動畫
	jQuery的動畫效果還能夠串行執行,經過delay()方法還能夠實現暫停,這樣,咱們能夠實現更復雜的動畫效果,而代碼卻至關簡單
	
	var div = $('#test-animates');
	// 動畫效果:slideDown - 暫停 - 放大 - 暫停 - 縮小
	div.slideDown(2000)
	   .delay(1000)
	   .animate({
		   width: '256px',
		   height: '256px'
	   }, 2000)
	   .delay(1000)
	   .animate({
		   width: '128px',
		   height: '128px'
	   }, 2000);
	}
相關文章
相關標籤/搜索