2013-01-09 192 views
0

我需要改變一個元素的水平位置。爲此,我將left屬性更改爲.css('left', value)。如果定義的值沒有left值,則會將該元素相對於應該出現的位置移動。如何計算一個元素的位置而不移動它?

現在我需要重新計算將元素移動到其他位置的位置,爲此,如果我沒有更改left屬性,我需要元素應該位於的位置。

我可以刪除left值並詢問它的位置,但然後該元素也會移動,並且希望避免這種情況,因爲我可能會使元素在位置之間跳躍。

我怎麼能得到元素的位置?

+0

爲什麼不'element.offset()left' - 'parseInt函數(element.css(「左').replace(「px」,「」))' –

+0

@chumkiu'parseInt()'將在px值上工作,而不需要'str.replace()' – phonicx

+0

@phonicx看起來你是對的: - ) –

回答

1

如果多次更改left樣式,元素不會在位置之間跳轉。只要您的功能正在運行,瀏覽器中就沒有更新。您可以安全地重置left樣式,獲取該位置,然後設置新的left值。

+0

到最後我改變了定位元素的方法,我只是用絕對定位。無論如何,你的答案是最有用的,謝謝。 –

1

一種方法是讀取DOM準備好的元素的默認左值並將其作爲元素的data-*屬性添加到元素 - 我們稱之爲data-default-left或類似的東西。當您需要進一步的默認值時,您可以隨時引用該值。

data-*很容易使用jQuery的.data()方法。

0

將左側設置爲0,重新計算並將左側設置爲新位置將是您案例中最簡單的更改。根據我的經驗,瀏覽器不會在css更新之間重新繪製。

其他一些選項:

  1. 使用絕對定位,而不是相對的。那麼你的起源是一致的。

  2. 使用jQuery UI position plugin。它可以讓你設置一個元素相對於另一個元素的位置。很有用。

0

如何使用.data()來存儲此信息之前開始移動它?然後你只要把它收回到那裏,每當你需要。

0

簡單。存儲在DOM負載變量的初始左額,然後引用它後,當你做你的其他計算:

$(function() { 

    var $element = $("#ME_ELEMENT_ID"); 

    var initialLeft = $element.offset().left; 

    // Change your left here 

    $element.css('left', '200px'); 

    // initialLeft still contains the old value 

}); 
相關問題