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);