javascript - 使用帧计时器的Raphaël动画

我目前从Raphaël开始，但很难弄清楚如何使用带有计时器的框架以灵活的方式制作动画。

使用KineticJS，这非常容易。我所需要的只是写一些类似的东西：

var anim = new Kinetic.Animation(function(frame){
  circle.setSomeAttribute(someFunction(frame.time));
}, layer);
anim.start();

这样，我实际上可以将我想要的任何内容放入someFunction()中，并更好地控制随时间传递给属性的值。无论如何，我可以通过Raphaël轻松地做到这一点吗？

谢谢 ：）

最佳答案

RaphaelJS将让您按百分比细分动画步长。例如：

    gear.stop().animate({
        "0%": { transform: gear.__start },
        "20%": { transform: gear.__start + ' r' + gear.__dir + '180'},
        "40%": { transform: gear.__start + ' r0'},
        "80%": { transform: gear.__start + ' r' + gear.__dir + '180'},
        "100%": { transform: gear.__start + ' r0'},
    }, 3000 );

这将绕过AFAIK宽松政策。无论如何，请参见http://jsfiddle.net/Cy8DQ/作为工作示例。