CSS3アニメーションのコールバック処理方法についての簡単な説明

JSアニメーションを行うと、1つのアニメーションが完了した後にイベントをトリガーしたり、1つのアニメーションが完了した後に別のアニメーションを実行したりするなど、コールバック処理を行う必要があることがよくありますが、CSS3アニメーションを使用すると動きをキャプチャできますか?ステータスのコールバック処理について?

CSS3 アニメーションはコールバックでも処理できます。1 つはトランジション [w3c ドキュメント]、もう 1 つはアニメーション [w3c ドキュメント] の 2 つの属性に分かれています。

1. トランジション

トランジションについては、アニメーションが完了したときにトリガーされる、transitionend イベントをリッスンできます。

2.アニメーションについては、animationendイベントを聞くことができます。サンプルコードは次のとおりです。