CSS3动画"进步"打回来

时间:2015-08-10 02:38:14

标签: javascript css3 css-transitions

我只是想知道是否有办法监控元素动画的进度。我所知道的只是animationstartanimationend,是否有某种animationprogress

1 个答案:

答案 0 :(得分:3)

不,没有animationprogess事件。根据{{​​3}},有三种类型的AnimationEvent事件。有animationstartanimationendanimationiteration。当动画即将重复时,animationiteration将被取代animationend

你可能会使用为动画时间的某一部分设置的setInterval()(例如动画时间的10%),然后在动画中的每个点都会调用。如果需要动画的精确位置,可以在任何这些计时器事件中查询动画的进度。

或者,如果您想要更精确的计时,可以将动画分解为多个连续动画,并在每个部分上使用animationend作为进度指示器,并启动动画的下一阶段。< / p>