Animation

Baseline 已廣泛支援

此功能已經成熟，並可在許多裝置和瀏覽器版本上使用。自 ⁨2020 年 3 月⁩起，它已在各瀏覽器中推出。

Web Animations API 中的 Animation 介面代表一個單獨的動畫播放器，併為動畫節點或源提供播放控制元件和時間線。

建構函式

Animation.currentTime: 動畫的當前時間值，以毫秒為單位，無論是正在執行還是已暫停。如果動畫沒有 timeline，處於非活動狀態或尚未播放，其值為 null。
Animation.effect: 獲取和設定與此動畫關聯的 AnimationEffect。這通常是一個 KeyframeEffect 物件。
Animation.finished 只讀: 返回此動畫當前的完成 Promise。
Animation.id: 獲取和設定用於標識動畫的 String。
Animation.overallProgress 只讀: 返回一個介於 0 和 1 之間的數字，表示動畫在其完成狀態下的總體進度。
Animation.pending 只讀: 指示動畫當前是否正在等待非同步操作，例如發起播放或暫停正在執行的動畫。
Animation.playState 只讀: 返回一個描述動畫播放狀態的列舉值。
Animation.playbackRate: 獲取或設定動畫的播放速率。
Animation.ready 只讀: 返回此動畫當前的就緒 Promise。
Animation.replaceState 只讀: 指示動畫是活動的、在被另一個動畫替換後被自動移除，還是透過呼叫 Animation.persist() 被顯式保留。
Animation.startTime: 獲取或設定動畫播放應開始的預定時間。
Animation.timeline: 獲取或設定與此動畫關聯的 timeline。

Animation.cancel(): 清除由此動畫引起的 keyframeEffects 並中止其播放。
Animation.commitStyles(): 將動畫的當前樣式狀態提交給正在動畫的元素，即使該動畫已被移除。它將導致當前樣式狀態以 style 屬性中屬性的形式寫入正在動畫的元素。
Animation.finish(): 根據動畫是正在播放還是正在反向播放，將動畫定位到其一端。
Animation.pause(): 暫停動畫的播放。
Animation.persist(): 顯式保留一個動畫，防止它在另一個動畫替換它時被自動移除。
Animation.play(): 開始或恢復動畫的播放，或者在動畫之前完成的情況下重新開始動畫。
Animation.reverse(): 反轉播放方向，停在動畫的開頭。如果動畫已完成或未播放，它將從末尾播放到開頭。
Animation.updatePlaybackRate(): 在首次同步其播放位置後設置動畫的速度。