JQuery動畫 animate 方法

2021-10-06 06:29:31 字數 1074 閱讀 8084

語法:

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

$

("div").

animate()

;//將div距左移動250畫素

預設情況下,所有 html 元素都有乙個靜態位置,且無法移動。如需對位置進行操作,要記得首先把元素的 css position 屬性設定為 relative、fixed 或 absolute。

操縱多個屬性:

animate()方法允許我們可同時操縱多個元素屬性。

$

("div").

animate()

;//將div距左移動250畫素

//背景色變為藍色

//變成半透明

//搞變成150畫素

//寬變成150畫素

在操縱多個元素的時候,每個屬性用單引號格開。在書寫屬性名的時候,要注意background-color要寫成backgroundcolor,padding-left要寫成paddingleft,同理:margin-left要寫成marginleft。

使用相對值:

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

例如:

$

("div").

animate()

;//將div距左移動(當前畫素加上250畫素)

//將div的高度變成(當前畫素-150畫素)

使用佇列功能:

乙個元素可以使用多個animate()方法來讓元素不停的改變:

var div=$(

"div");

div.

animate(,

"slow");

div.

animate(,

"slow");

//距左邊100px

//距右邊100px

當我們建立很多個animate呼叫,jquery會建立包含這些方法呼叫的"內部"佇列。然後逐一執行這些 animate 呼叫。

解決jquery中animate動畫積累

無縫式焦點圖 var left 770 var left left 770 function slideimg slidepics animate 1000 left left left tim settimeout slideimg,5000 slideimg 由於以前也沒遇到過此問題,我也是想了...

jQuery 效果 動畫animate的使用

語法 selector animate speed,callback 引數說明 必需的 params 引數定義形成動畫的 css 屬性。可選的 speed 引數規定效果的時長。它可以取以下值 slow fast 或毫秒。可選的 callback 引數是動畫完成後所執行的函式名稱。document r...

jQuery動畫animate方法使用介紹

用於建立自定義動畫的函式。返回值 jquery animate params,duration easing callback 如果使用的是 hide show 或 toggle 這樣的字串值,則會為該屬性呼叫預設的動畫形式。paramsoptions一組包 含作為動畫屬性和終值的樣式屬性和及其值的...