每次点击如何使旋转动画旋转90度？

Question

我有一个名为turnWheel的函数：

turnWheel : function() {
    var el = this.getContainerElement().getDomElement();
    qx.bom.element.Animation.animate(el, {
        duration: 300, 
        timing: "linear", 
        keep: 100, 
        origin: "50% 50%",
        keyFrames : {
          0: {rotate: "0deg"},
          50: {rotate: "45deg"},
          100 : {rotate : "90deg"}
        }
    });
}

但是当我执行turnWheel时，它会将图像旋转90度。但是，如果我再次执行，图像将返回原始位置并旋转相同的90度。我想要实现的是，每次点击时图像都会旋转90度，然后在第二次点击时移动到下一个90度，依此类推。

我错过了什么？

Answer 1

您可以在方法的每次调用中计算旋转，或者读取前一个旋转值，或者只是通过存储外部计数器。查看游乐场样本（如果已创建）以向您显示有效的解决方案：

http://tinyurl.com/ox653l5