jQuery的隊列功能

Question

採取以下兩種方法：

function moveUp() { 
    this.element.rotate(0); 
    this.element.animate({"margin-top": "-=51px"}, "slow"); 
    //do some more things for instance.  
} 

function moveRight() { 
    this.element.rotate(90); 
    this.element.animate({"margin-left": "+=51px"}, "slow"); 
} 

以防萬一，我在旋轉的物體，然後用動漫周邊移動。這些功能被映射到按鍵，所以如果用戶按下向上或向右，對象移動。我的問題是動畫正常排隊，因爲jQuery爲它們使用fx隊列。但是旋轉立即發生，以及我做的任何其他事情，因爲它們是我的代碼中的自定義事物。

的後果是顯而易見的，如果按即至多並立即按下右，對象旋轉了起來，但是當它向上運動時，它旋轉的權利，它並沒有真正等待，直到它到達那裏。

我怎麼能寫這樣的代碼，使整個方法鏈的，不僅僅是他們的動畫。我可以添加回調，但它們並不總是一起執行，如果它們碰巧同時被調用，我需要它們排隊​​，但我不太瞭解如何在jQuery中使用隊列功能。

順便說一句，多看這背後的代碼，我最近問這個問題也：Array of prototype functions

Answer 1

你可以使用類似製作動畫：

$elem.animate({rotation: 90}, 
    { 
      duration: 'slow', 
      step: function(now, fx) { 
        $(this).css({ "transform": "rotate("+now+"deg)", "-webkit-transform": "rotate("+now+"deg)", "-moz-transform": "rotate("+now+"deg)" }); 
      } 
    }) 

這將其添加到隊列自動

我做了這裏的jsfiddle：

http://jsfiddle.net/obartra/7Qwgd/1/

編輯：只是爲了說明我的理由，我猜的rotate方法使用的是正在使用的setTimeout設置在CSS的旋轉逐步，因此不能將其添加到動畫隊列。這裏的代碼使用animate來旋轉元素，以便將它添加到動畫隊列中。