CSS3 トランジションイベント 質問する

CSS3 トランジションイベント 質問する

CSS3 トランジションが開始または終了したかどうかを確認するために要素によって発生するイベントはありますか?

ベストアンサー1

W3C CSS トランジション ドラフト

CSS トランジションが完了すると、対応する DOM イベントが生成されます。トランジションを受けるプロパティごとにイベントが発生します。これにより、コンテンツ開発者はトランジションの完了と同期するアクションを実行できます。


ウェブキット

遷移がいつ完了するかを判断するには、遷移の終了時に送信される DOM イベントの JavaScript イベント リスナー関数を設定します。イベントは WebKitTransitionEvent のインスタンスであり、そのタイプは ですwebkitTransitionEnd

box.addEventListener( 'webkitTransitionEnd', 
    function( event ) { alert( "Finished transition!" ); }, false );

モジラ

遷移が完了したときに発生するイベントが 1 つあります。Firefox ではイベントはtransitionend、Opera ではoTransitionEnd、WebKit では ですwebkitTransitionEnd

オペラ

利用可能な遷移イベントの種類は 1 つあります。このoTransitionEndイベントは遷移の完了時に発生します。

インターネットエクスプローラ

イベントtransitionendは遷移の完了時に発生します。遷移が完了前に削除された場合、イベントは発生しません。


Stack Overflow: ブラウザ間で CSS3 トランジション関数を正規化するにはどうすればよいですか?

おすすめ記事