javascript - 检测 polymer 网络动画是否完整的方法？

Question

我正在努力寻找一些东西来检测动画何时完成。有任何想法吗？也许是事件监听器之类的？我也不知道这是否是实际播放动画的最佳方式..

    $(showMore).click(function () {
              var shrinky = new Animation(showMore, [{transform: 'scale(1)'}, {transform: 'scale(0)'}], {fill: 'forwards', duration: 500, easing: 'ease-out'});
              document.timeline.play(shrinky);
    });

比如我能以某种方式检测到比例何时为 0 吗？任何帮助将不胜感激，谢谢!- 山

编辑:我的动画似乎在结束时没有触发“完成”事件，但应该如此。也许我只是错误地制作了动画..

编辑好吧，解决方案是我试图调用动画而不是 animationPlayer 的“完成”事件。正确的代码是这样的:

var shrinky = new Animation(showMore, [{transform: 'scale(1)'}, {transform: 'scale(0)'}], {fill: 'forwards', duration: 500, easing: 'ease-out'});
    var playShrink = document.timeline.play(shrinky);
    playShrink.addEventListener('finish', function() {
    console.log('this is done');
});

Answer 1

据我所知，动画会触发“结束”事件(我自己还没有尝试过)。

shrinky.addEventListener('end', function() {
  doSomething
});