プレミアム会員限定動画

アニメーションの流れを細かくコントロールする「offset（オフセット）」について。Web Animation s API で細かい調整をしましょう。

この動画では、Web アニメーションAPI (Web Animations API) のオフセット機能について解説しています。
オフセットは、アニメーションの各段階をカスタマイズするために使用されます。例えば、アニメーション全体が2000ミリ秒（2秒）で進行する場合、この時間を分割し、それぞれの割合（パーセンテージ）でアニメーションの各段階を設定します（0%、25%、50%、75%、100%）。
オフセットの値は0から1の間で設定し、これによりアニメーションの開始（0）と終了（1）を表します。この機能を利用することで、アニメーションの特定の部分を早めたり遅めたりすることができます。これにより、アニメーションの流れを細かくコントロールできます。

また、複数のアニメーションプロパティに対して、異なるオフセット値を設定することもできます。これにより、アニメーション中の各要素の動きを細かく調整できます。