2013-01-09 150 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 

}); 
相关问题