SVGアニメーション – Web Animations API を使う – Animation

ここからは Animation のAPI(インターフェイス) を使用した方法を試します。

Animation のAPIのプロパティとメソッド

プロパティ

Animation.currentTime
Animation.effect
Animation.finished
Animation.id
Animation.pending
Animation.playState
Animation.playbackRate
Animation.ready
animation.replaceState
Animation.startTime
Animation.timeline

メソッド

Animation.cancel()
Animation.finish()
Animation.pause()
Animation.play()
Animation.reverse()

(MDNから抜粋)

Animation()によるAnimationオブジェクトの生成

animationオブジェクトを生成するには以下のように書きます。

var animation = new Animation([effect][, timeline]);

引数はそれぞれ以下の指定をします。

effect
アニメーションに割り当てるエフェクト効果を指定。
現時点ではKeyFrameEffectオブジェクトのみ。

timeline
アニメーションに関連づけるtimelineを指定
現時点ではDocumentTimelineオブジェクトのみ。