transform - 如何查找转换完成的时间

Question

我一直在使用this website中的代码

现在，我想做的就是在转换完成后进行监听，以便我可以按顺序开始另一个转换。例如...

import "dart:html";

num rotatePos = 0;

void main() {
  query("#buttonRotate").onClick.listen(rotateElement);
}

void rotateElement(Event e) {
  rotatePos += 360;
  Element element = e.target;

  element.style.transition = "1s";
  element.style.transform = "rotate(${rotatePos}deg)";

  //Thank you for the help, here is my code for anyone else having
  //questions about this...
  element.onTransitionEnd.listen(transitionFinished);
}

void transitionFinished(Event e) {
  query("#text").text = "Event Finished!";
}

然后，当转换或过渡完成时，我将如何设置监听？还是我只是以错误的方式来做这件事？基本上，我最终想要做的是依次播放一系列过渡，还可以暂停和继续动画。我以为也许animationEvent类可能是我需要使用的类，但是到目前为止，我发现的示例似乎在 Canvas 上使用了此类，而我只想为dom元素设置动画。

Answer 1

使用onwebkitTransitionEnd事件