JQuery动画计算像素距离

Question

我正在使用JQuery来为面板系统菜单设置动画效果。问题是，有5个面板，我不能直接设置面板左：属性，因为它需要基于它的当前位置来计算它。我的脚本应该解释。

$('.panel').animate({left: '-250'}, 300); 

所以这很好，因为在第一次单击时，它将第一个面板滑出视图，第二个面板滑入视图。然而，在第二个面板中单击时，它不会滑动到第三个面板，因为它告诉所有面板。面板要移至left:-250。我想让它解决当前剩下的问题：？是.panel，然后再添加一个-250来生成动画。

这样，如果left:0我们在第一个面板上，并点击我们将会去left:-250。点击第二个面板，它将添加-250 + -250和动画到-500等..等等...

任何想法？

Answer 1

您需要使用偏移量或偏移父值来获取位置。

http://api.jquery.com/offset/

http://api.jquery.com/offsetParent/

像这样的东西; （未测试）

var offset = $('.panel').offset(); 
    alert(offset.left); 
    alert(offset.top) 
    var newpos = [offset.left - 250] 
    $('.panel').animate({left: newpos}, 300);