拉斐爾js鏈接動畫

Question

我試圖強制一個動畫開始後，另一個結束，並根據文檔，我應該包括一個回調函數，應該在動畫結束時調用。

但是，兩個動畫都是同時執行的......我做錯了什麼？

http://jsfiddle.net/yBehH/

$(document).ready(function() { 
    function drawBonuses() { 
     bonus = [3, 9, 10, 17]; 
     $.each(bonus,function(i,v) { 
      gameboard.circle(v*20+20, 20, 0).animate({ fill: "#f00", r: 5 } , 100); 
     }); 
    }; 

    gameboard = Raphael("gameboard", 440, 440); 
    gameboard.clear(); 
    gameboard.rect(200, 200, 0, 0, 5).animate({fill: "#fff", height: 400, width: 400, x:20, y:20, stroke: "#000", "stroke-width": 20}, 2000, drawBonuses()); 
}); 

的點應該啓動動畫當董事會是完全動畫...

Answer 1

目前你有

obj.animate(..., drawBonuses()); 

即drawBonuses被稱爲immeadiately和返回值傳遞到animate()。
你想通過函數本身：

obj.animate(..., drawBonuses); 

http://jsfiddle.net/yBehH/2/