Animation

Baseline 2022

Newly available

Since September 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

Web 动画 API动画接口表示一个单个动画播放器并且提供用于一个动画节点或源的回放控制和一个时间轴。

构造函数

Animation()

创建一个新的 Animation 对象实例。

属性

Animation.currentTime

动画的当前时间值(以毫秒为单位),无论是正在运行还是已暂停。如果动画缺少timeline或尚未播放,其值为 null。

Animation.effect

获取或设置与此动画相关联的KeyframeEffect (en-US)

Animation.finished 只读

返回此动画的当前完成的状态。

Animation.id

获取或设置用于标识动画的字符串。

Animation.playState 只读

返回描述动画播放状态的枚举值。

Animation.playbackRate (en-US)

返回或设置动画的播放速率。

Animation.ready (en-US) 只读

返回此动画的当前就绪状态。

Animation.startTime (en-US)

获取或设置动画播放应开始的预定时间。

Animation.timeline (en-US)

获取或设置与此动画相关联的timeline

事件处理程序

Animation.oncancel

获取并设置取消事件的事件处理程序。

Animation.onfinish (en-US)

获取并设置完成事件的事件处理程序。

方法

Animation.cancel()

清除此动画的所有keyframeEffects (en-US),并中止播放。

Animation.finish() (en-US)

设置动画中止播放。

Animation.pause() (en-US)

暂停播放动画。.

Animation.play()

开始或恢复播放动画,或者如果之前完成,则重新开始动画。

Animation.reverse() (en-US)

反转播放动画,直到播放到动画开始时停止。如果动画完成或未播放,它将从头到尾播放。

规范

Specification
Web Animations
# the-animation-interface

浏览器兼容性

BCD tables only load in the browser