jQuery中的動畫 《鋒利的JQuery》

2022-02-08 02:58:17 字數 1011 閱讀 5152

自css3以來,主流**開始偏向於扁平風格和動畫效果,這時就可以jquery的動畫就可以發揮其長處了,靈活的應用其動畫api,讓我們可以設計出很多絢麗的效果。下面,讓我們來列舉一些jquery常用的動畫api。

1、show()和hide()方法

1

//從display:none還原元素預設或已設定的display屬性

2 $("selector").show() ;34

//設定元素的display樣式為none,等於$("selector").css("display","none")

5 $("selector").hide() ;

用法同show()、hide(),也可以在裡面傳引數。

用法同show()、hide(),也可以在裡面傳引數。

1

//語法:

2 $("selector").animate(params,speed,callback);

3 params:乙個包含樣式屬性及值的對映,比如

4speed:速度引數,可選

5 callback:在動畫完成時執行的引數(即**函式),可選

常見的動畫例子:

1

1917

1

1

1

1

1

//切換元素的可見狀態,如元素隱藏則切換為可見,反之亦然

2 $("selector").toggle() 3//

通過高度變化來切換元素的可見性

4 $("selector").slidetoggle() 5//

把元素的不透明度以漸進方式調整到指定的值,如$("selector").fadeto(600,0.2);以600毫秒速度將內容調整到20%透明度

6 $("selector").fadeto()

. ..

鋒利的JQuery(六)

ajax 可以設定beforesend error success complete等 getscript 載入js檔案 getjson 載入json檔案 each 通用的遍歷方法 serialize 將dom元素內容序列化為字串 serializearray 將dom元素內容序列化為json格式的...

鋒利的JQuery(五)

jquery與ajax load load url restext load test.html 載入所有元素 load url selector restext load test.html para 載入class為para的元素 load url,callback restext load t...

鋒利的jquery學習

jquery物件是通過jquery包裝dom物件後產生的物件,是jquery獨有的。jquery物件無法使用dom物件的任何方法,dom物件也不能使用jquery物件的方法。jquery提供兩個方法將乙個jquery物件轉換成dom物件。var cr cr jquery物件 var cr cr 0 ...