動畫效果:
1.顯示/隱藏動畫效果
動態的改變當前元素的寬,高和不透明度
show([duration],[fn]); //顯示當前元素
hide([duration],[fn]); //隱藏當前元素
toggle([duration],[fn]); //切換當前元素的可見狀態
duration:動畫效果執行的時間,預設為0,立即顯示元素
關鍵字:"slow","normal","fast" - 0.6,0.4,0.2秒
數字:600,400,200,... 單位是毫秒
fn:在動畫完成時執行的函式
2.淡入/淡出動畫效果
動態的改變當前元素的透明度(其他不變)
fadein([duration],[fn]) //顯示當前元素 - 淡入效果
fadeout([duration],[fn]) //隱藏當前元素 - 淡出效果
fadetoggle([duration],[fn]) //切換當前元素的可見狀態 -- duration預設為normal,0.4秒
fadeto([duration],opacity,[fn]) //在指定時間內,從當前透明度淡到指定透明度
opacity:指定不透明值,取值範圍是0-1,0代表完全透明,1代表完全不透明
3.滑入/滑出動畫效果
動態的改變當前元素的高度(其他不變)
slidedown([duration],[fn]) //顯示當前元素 - 由上到下滑入
slideup([duration],[fn]) //隱藏當前元素 - 由下到上滑出
slidetoggle([duration],[fn]) //切換當前元素的可見狀態
4.自定義動畫
動態的改變當前元素的各種css屬性
animate(properties,[duration],[fn])
properties:使用乙個"name:value"形式的物件,,用來設定改變的css屬性
animate():只能改變可以取數字值的css屬性,如大小,邊框,定位,字型,背景,...
移動元素是需要顯示元素的position屬性為absolute/relative.
"佇列"動畫:元素執行多個動畫效果,即元素執行多個animate()方法,按照方法的順序進行動畫效果的展示.
5.動畫停止
stop()結束當前動畫,立即進入到下乙個動畫
stop([clearqueue],[gotoend])
clearqueue:是否清空未執行完的動畫佇列.設定true,可以立即結束動畫
gotoend:是否立即完成正在執行的動畫.設定true,並且重設show和hide的原始樣式,呼叫**函式等
jQuery的常用動畫效果
1.jquery的級聯選單 在做下拉列表時,乙個下拉項的改變常常會引起其他下拉列表中的選項發生變化,例如地域選擇 的省市縣聯動改變 a 首先在標籤中引入jquery,注意路徑問題 b 搭建基本的web標籤介面請選擇省 陝西省河南省 江蘇省c 編寫jquery 實現級聯功能 2.鍵盤事件 通過特定的鍵...
jquery 12 jquery常用動畫效果有哪些
在方法裡面帶上時間引數即可,所有的都是這樣 25 this next fadeout 1000 5 this next slideup 1000 2 h1 click function else 9 用css 拿出屬性值,然後判斷,比如判斷顯隱就可以用下面方法 22 d this next css ...
jquery 12 jquery常用動畫效果有哪些
在方法裡面帶上時間引數即可,所有的都是這樣 25 this next fadeout 1000 5 this next slideup 1000 2 h1 click function else 9 用css 拿出屬性值,然後判斷,比如判斷顯隱就可以用下面方法 22 d this next css ...