TransitionEvent インターフェイスは、トランジションに関する情報を提供するイベントを表します。

コンストラクター

TransitionEvent()

指定された引数でTransitionEvent イベントを作成します。

インスタンスプロパティ

親であるEvent から継承したプロパティもあります。

TransitionEvent.propertyName読取専用

文字列で、このトランジションに関連付けられた CSS プロパティの名前が入ります。

TransitionEvent.elapsedTime読取専用

float で、このイベントが発生した時点でトランジションが実行している時間を秒単位で表します。この値はtransition-delay プロパティの影響を受けません。

TransitionEvent.pseudoElement読取専用

文字列で、:: で始まる、アニメーションが実行される擬似要素の名前が入ります。トランジションが擬似要素上ではなく要素上で実行されている場合は、空文字列'' になります。

TransitionEvent の種類

transitioncancel

Event で、CSS トランジションが中断されたときに発生します。

transitionend

Event で、CSS トランジションの実行が終了したときに発生します。

transitionrun

Event で、CSS トランジションが生成されたとき、実行中のトランジションに追加されたときに発生し、必ずしも開始時に発生するとは限りません。

transitionstart

Event で、CSS トランジションの推移が開始したときに発生します。

インスタンスメソッド

親であるEvent から継承したプロパティもあります。

仕様書

ブラウザーの互換性

関連情報

• CSS トランジションの使用
• CSS プロパティ:transition,transition-delay,transition-duration,transition-property,transition-timing-function