AnimationEvent

表示动画事件对象,继承自 CustomEvent,用于描述动画在其生命周期中的状态变化,比如开始、结束等。

该事件对象包含动画的类型、名称等信息。

实例属性

detail

detail: {
  animation_type: string,
  animation_name: string,
  new_animator: boolean,
}

表示该事件所属动画的一些基础信息。

  • animation-type: 该动画的类型。如果是关键帧动画,这个值为 keyframe-animation;如果是过渡动画,这个值为 transition-animation
  • animation-name: 该动画的名称。如果是关键帧动画,就是 CSS 里 @keyframes 的名字;如果是过渡动画,就是 CSS 里 transition-property 的名字。
  • new_animator: 默认值,为 true

AnimationEvent 的类型

INFO

在动画执行过程中,若做动画的节点被卸载销毁,则该节点上的 animationcancel 以及 transitioncancel 事件将不会触发。

animationstart

表示关键帧动画播放开始。

animationend

表示关键帧动画播放结束。

animationcancel

表示关键帧动画播放被取消。

animationiteration

表示关键帧动画播放次数迭代。

transitionstart

表示过渡动画播放开始。

transitionend

表示过渡动画播放结束。

transitioncancel

表示过渡动画播放被取消。

兼容性

LCD tables only load in the browser

除非另有说明,本项目采用知识共享署名 4.0 国际许可协议进行许可,代码示例采用 Apache License 2.0 许可协议进行许可。