1、顯示 隱藏
使用 hide() 和 show() 方法來隱藏和顯示 html 元素;使用 toggle() 方法來切換 hide() 和 show() 方法。
語法:
$(selector).hide(speed,callback);其中$(selector).show(speed,callback);
$(selector).toggle(speed,callback);
speed 為隱藏/顯示的速度,可以取以下值:"slow"、"fast" 或毫秒;callback 為執行操作hide()、show()、 toggle() 方法完成後所執行的函式名稱。
$("#hide").click(function());$("#show").click(function());
$("#toggle").click(function());2、淡入淡出(fadein fadeout fadetoggle fadeto)
語法:
$(selector).fadein(speed,callback);
$(selector).fadeout(speed,callback);
$(selector).fadetoggle(speed,callback);
$(selector).fadeto(speed,opacity,callback);fadein() 用於淡入已隱藏的元素;fadeout() 方法用於淡出可見元素;fadetoggle() 方法可以在 fadein() 與 fadeout() 方法之間進行切換;fadeto() 方法允許漸變為給定的不透明度(值介於 0 與 1 之間),opacity為透明度值,speed和callback同1。
示例:
$("button").click(function());
3、滑動(slidedown slideup slidetoggle)
語法:
$(selector).slidedown(speed,callback);
$(selector).slideup(speed,callback);
$(selector).slidetoggle(speed,callback);slidedown() 方法用於向下滑動元素;slideup() 方法用於向上滑動元素;slidetoggle() 方法可以在 slidedown() 與 slideup() 方法之間進行切換。
4、自定義動畫(animate)
語法:
$(selector).animate(,speed,callback);params 引數定義形成動畫的 css 屬性。params的css屬性即為動作後的最終屬性。
示例1:
$("button").click(function());});
示例2:
$("button").click(function(),"slow");
一幀串起來就成了乙個動畫。div.animate(,"slow");
div.animate(,"slow");
div.animate(,"slow");
});
具體的動畫效果可參見:
5、停止動畫或者滑動(stop)
stop() 方法用於停止動畫或效果,在它們完成之前,適用於所有 jquery 效果函式,包括滑動、淡入淡出和自定義動畫。
語法:$(selector).stop(stopall,gotoend);
可選的 stopall 引數規定是否應該清除動畫佇列。預設是 false,即僅停止活動的動畫,允許任何排入佇列的動畫向後執行。
可選的 gotoend 引數規定是否立即完成當前動畫。預設是 false。
因此,預設地,stop() 會清除在被選元素上指定的當前動畫。
示例:
$("#panel").stop();
6、鏈條式
$("#p1").css("color","red").slideup(2000).slidedown(2000);可依次執行。
jQuery學習之二 jQuery效果
1 jquery 效果之隱藏和顯示 selector toggle speed,callback 隱藏 顯示切換 可選的 speed 引數規定隱藏 顯示的速度,可以取以下值 slow fast 或毫秒。可選的 callback 引數是隱藏或顯示完成後所執行的函式名稱。利用隱藏和顯示功能可以實現tab...
jQuery學習筆記2 jQuery簡易效果
接上次的jquery學習筆記,這次的主題就是其簡易效果,例如淡入淡出,顯示隱藏的效果。整理網上的資料,可以得到這樣乙個方法列表。方法描述 animate 對被選元素應用 自定義 的動畫 clearqueue 對被選元素移除所有排隊函式 仍未執行的 delay 對被選元素的所有排隊函式 仍未執行 設定...
jQuery自學筆記(三) jQuery動畫效果
jquery隱藏和顯示 使用 hide 和 show 方法來隱藏和顯示 html 元素 語法 selector hide speed,callback selector show speed,callback 可選的 speed 引數規定隱藏 顯示的速度,可以取以下值 slow fast 或毫秒,可...