TransitionEvent
Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
TransitionEvent
インターフェイスは、トランジションに関する情報を提供するイベントを表します。
コンストラクター
TransitionEvent()
(en-US)- 指定された引数で
TransitionEvent
イベントを作成します。
プロパティ
親である Event
から継承したプロパティもあります。
TransitionEvent.propertyName
(en-US) 読取専用DOMString
で、トランジションに関連付けられた CSS プロパティの名前が入ります。TransitionEvent.elapsedTime
(en-US) 読取専用float
で、このイベントが発生した時点でトランジションが実行している時間を秒単位で表します。この値はtransition-delay
プロパティの影響を受けません。TransitionEvent.pseudoElement
読取専用DOMString
で、::
で始まる、アニメーションが実行される擬似要素の名前が入ります。トランジションが擬似要素上ではなく要素上で実行されている場合は、空文字列''
になります。
TransitionEvent
の種類
transitioncancel
Event
で、 CSS トランジションが中断されたときに発生します。transitionend
Event
で、 CSS トランジションの実行が終了したときに発生します。transitionrun
Event
で、 CSS トランジションが生成されたとき、実行中のトランジションに追加されたときに発生し、必ずしも開始時に発生するとは限りません。transitionstart
Event
で、 CSS トランジションの推移が開始したときに発生します。
メソッド
親である Event
から継承したプロパティもあります。
TransitionEvent.initTransitionEvent()
(en-US) Non-Standard Deprecated- 非推奨の
Document.createEvent("TransitionEvent")
メソッドを使用して生成されたTransitionEvent
を初期化します。
仕様書
仕様書 | 状態 | 備考 |
---|---|---|
CSS Transitions TransitionEvent の定義 |
草案 | 初回定義 |
ブラウザーの互換性
BCD tables only load in the browser