Question

我想创建一个鼠标翻转效果，就像我们以前在flash网站上看到的那样 - 当鼠标滚过它开始动画的元素时，但是如果在动画的中间，鼠标滚出动画将停止并且跑回来。

我想用布料达到同样的效果，但我似乎找到了停止动画的方法。例如：

rect.animate('top', '200', {
    duration: 1000,
    onChange: canvas.renderAll.bind(canvas),
    onComplete: function() {
      //callback code goes here
    }
  });

这会动画，直到top的{{1}}值变为rect。有没有办法在此之前停止动画？

Answer 1

您需要指定abort功能。

rect.animate('top', '200', {
    duration: 1000,
    onChange: canvas.renderAll.bind(canvas),
    onComplete: function() {
      //callback code goes here
    },
    abort: function(){
      return someConditionWhichAbortsAnimationWhenItsTrue;
    }
});

唯一的问题是abort未传入基础fabric.util.animate，which I just fixed，因此您需要使用最新版本：）

如何停止（为了反转）fabricjs动画

1 个答案: