Animation 具有现有元素数组的Raphael动画序列

我正在尝试使用Raphael.js创建一个简单的动画序列。具体来说，我在一个数组中有一组拉斐尔元素（圆），需要它们一个接一个地淡入

我找到了一个jQuery插件“jQuery.eachStep（）”，但我不知道如何让它工作。拉斐尔在工作，但“每一步”都没有

或者，如果我可以得到一个适当的循环工作，这将是足够的

---

我想你可能不想要一个each函数，除非你在其中增加一个延迟或什么。animate方法有一个回调函数，它将在动画完成时调用一个函数（第4个参数）。所以你可以让它像这样递归

var rsr = Raphael('rsr', '600', '300');
var fillColor = {fill: '#00A651','stroke-width': '0','opacity': '1'}

var circle_b = rsr.circle(513, 128, 4).attr(fillColor);
var circle_c = rsr.circle(477, 128, 4).attr(fillColor);
var circle_d = rsr.circle(441, 128, 4).attr(fillColor);   
var circle_e = rsr.circle(406, 128, 4).attr(fillColor);
var circle_f = rsr.circle(370, 128, 4).attr(fillColor);
var circle_g = rsr.circle(334, 128, 4).attr(fillColor);
var circle_h = rsr.circle(298, 128, 4).attr(fillColor);
var circle_i = rsr.circle(262, 128, 4).attr(fillColor);
var circle_j = rsr.circle(226, 128, 4).attr(fillColor);
var circle_k = rsr.circle(191, 128, 4).attr(fillColor);
var circle_l = rsr.circle(155, 128, 4).attr(fillColor);


var collection = [ 
    circle_b, circle_c, circle_d, circle_e, circle_f, circle_g, circle_h, circle_i, circle_j, circle_k, circle_l 
];

function nextAnim( count ) {
    if( count >= collection.length ) { return }
    collection[ count ].animate( {'opacity': '0'}, 1000, 'linear', nextAnim.bind(null,count+1 ) );
};
 nextAnim(0);

---

JSFIDLE

忘记响应。。。这正是我需要的。谢谢,谢谢!！我会投你一票，但我不同意。很高兴这有帮助。我猜你可以接受这个答案，如果这个解决方案对你合适的话？

var rsr = Raphael('rsr', '600', '300');
var fillColor = {fill: '#00A651','stroke-width': '0','opacity': '1'}

var circle_b = rsr.circle(513, 128, 4).attr(fillColor);
var circle_c = rsr.circle(477, 128, 4).attr(fillColor);
var circle_d = rsr.circle(441, 128, 4).attr(fillColor);   
var circle_e = rsr.circle(406, 128, 4).attr(fillColor);
var circle_f = rsr.circle(370, 128, 4).attr(fillColor);
var circle_g = rsr.circle(334, 128, 4).attr(fillColor);
var circle_h = rsr.circle(298, 128, 4).attr(fillColor);
var circle_i = rsr.circle(262, 128, 4).attr(fillColor);
var circle_j = rsr.circle(226, 128, 4).attr(fillColor);
var circle_k = rsr.circle(191, 128, 4).attr(fillColor);
var circle_l = rsr.circle(155, 128, 4).attr(fillColor);


var collection = [ 
    circle_b, circle_c, circle_d, circle_e, circle_f, circle_g, circle_h, circle_i, circle_j, circle_k, circle_l 
];

function nextAnim( count ) {
    if( count >= collection.length ) { return }
    collection[ count ].animate( {'opacity': '0'}, 1000, 'linear', nextAnim.bind(null,count+1 ) );
};
 nextAnim(0);