Web Animations API

概念与用法

Web Animations API 为浏览器和开发者提供了一种通用语言来描述 DOM 元素的动画。要获取有关 API 概念以及如何使用的更多信息，请阅读 使用 Web Animations API。

Web Animations 接口

Animation

为动画节点或源提供播放控件和时间轴。可以接受使用 KeyframeEffect() 构造函数创建的对象。

KeyframeEffect

描述一组可设置动画的属性和值，称为关键帧及其时序选项。然后可以使用 Animation() 构造函数来播放这些关键帧。

AnimationTimeline

表示动画的时间轴。此接口用于定义时间轴功能（由 DocumentTimeline 和未来的时间轴对象继承），并且开发者本身不直接访问它。

AnimationEvent

CSS Animations 模块的一部分，用于捕获动画名称和已用时间。

DocumentTimeline

表示动画时间轴，包括默认的文档时间轴（可通过 Document.timeline 属性访问）。

其他接口的扩展

Web Animations API 为 document 和 element 添加了功能。

Document 接口的扩展

document.timeline

表示默认文档时间轴的 DocumentTimeline 对象。

document.getAnimations()

返回一个 Array，其中包含当前在 document 的元素上生效的 Animation 对象。

Element 接口的扩展

Element.animate()

一个快捷方法，用于在元素上创建和播放动画。它返回创建的 Animation 对象实例。

Element.getAnimations()

返回一个 Array，其中包含当前影响元素或计划在未来影响元素的 Animation 对象。

规范

另见

• CSS animation 简写属性
• CSS animation-timeline 属性
• 使用 Web 动画 API
• 使用 CSS 动画
• CSS 动画模块
• CSS 滚动驱动动画模块