jQuery一些常用特效方法使用例項

2021-09-08 03:45:49 字數 2157 閱讀 9088

1. jquery fadein() 用於淡入已隱藏的元素。

語法:

$(selector).fadein(speed,callback);

例項:

$("button").click(function());

2. jquery fadeout() 方法用於淡出可見元素。

語法:

$(selector).fadeout(speed,callback);

3.jquery fadetoggle() 方法可以在 fadein() 與 fadeout() 方法之間進行切換。

如果元素已淡出,則 fadetoggle() 會向元素新增淡入效果。

如果元素已淡入,則 fadetoggle() 會向元素新增淡出效果。

語法:

$(selector).fadetoggle(speed,callback);

例項:$("button").click(function());

4.。語法:

$(selector).fadeto(speed,opacity,callback);

必需的 speed 引數規定效果的時長。它可以取以下值:"slow"、"fast" 或毫秒。

fadeto() 方法中必需的 opacity 引數將淡入淡出效果設定為給定的不透明度(值介於 0 與 1 之間)。例項

$("button").click(function());

5. jquery slidedown() 方法用於向下滑動元素。

語法:

$(selector).slidedown(speed,callback);

$("#flip").click(function());

6. jquery slideup() 方法用於向上滑動元素。

語法:

$(selector).slideup(speed,callback);

可選的 speed 引數規定效果的時長。它可以取以下值:"slow"、"fast" 或毫秒。

可選的 callback 引數是滑動完成後所執行的函式名稱。

7. jquery slidetoggle() 方法可以在 slidedown() 與 slideup() 方法之間進行切換。

如果元素向下滑動,則 slidetoggle() 可向上滑動它們。

如果元素向上滑動,則 slidetoggle() 可向下滑動它們。

$(selector).slidetoggle(speed,callback);

8. jquery animate() 方法用於建立自定義動畫。

語法:

$(selector).animate(,speed,callback);

必需的 params 引數定義形成動畫的 css 屬性。

可選的 speed 引數規定效果的時長。它可以取以下值:"slow"、"fast" 或毫秒。

可選的 callback 引數是動畫完成後所執行的函式名稱。

也可以定義相對值(該值相對於元素的當前值)。需要在值的前面加上 += 或 -=:

也可以定義一組animate,實現佇列功能。

下面的例子演示 animate() 方法的簡單應用;它把 元素移動到左邊,直到 left 屬性等於 250 畫素為止:

例項

$("button").click(function());
});

9. jquery stop()方法用於停止動畫或效果,在它們完成之前

10.當動畫 100% 完成後,即呼叫 callback 函式。

典型的語法:

$(selector).hide(speed,callback)

11.jquery 方法鏈結

有些元素只要獲取一遍就可以,所以可以利用鏈結對方法追加。

就是方法點方法。如

$("#p1").css("color","red").slideup(2000).slidedown(2000);

jquery必須知道的一些常用特效方法。加用法例項

1.jquery fadein 用於淡入已隱藏的元素。語法 selector fadein speed,callback 例項 button click function 2.jquery fadeout 方法用於淡出可見元素。語法 selector fadeout speed,callback 3...

jquery一些方法

1,追加元素 prepend 在被選元素的開頭插入內容 after 在被選元素之後插入內容 before 在被選元素之前插入內容 引數可以為string 也可以為html 2,離開頁面時,提示 不是jquery方法 3,選擇元素 匹配id以aaa開頭 select id aaa 匹配id以aaa結尾...

jquery中常用的一些方法

index 的使用 格式 index selector element 返回 number 搜尋匹配的元素,並返回相應元素的索引值,從0開始計數。如果不給 index 方法傳遞引數,那麼返回值就是這個jquery物件集合中第乙個元素相對於其同輩元素的位置。selector 乙個選擇器,代表乙個jqu...