Bagaimanakah anda boleh memantau permulaan dan tamat peralihan CSS3 yang tepat?

Peristiwa Peralihan CSS3: Memantau Peralihan dengan Ketepatan

Soalan: Bagaimanakah anda boleh menentukan dengan tepat apabila peralihan CSS3 bermula atau tamat?

Jawapan:

Penyiapan peralihan CSS mencetuskan acara DOM yang sepadan. Setiap harta yang mengalami peralihan menjana peristiwa individu. Mekanisme ini membolehkan pembangun menyegerakkan tindakan dengan penyiapan peralihan.

Acara Khusus Penyemak Imbas:

• W3C: Penyelesaian kebakaran peralihan 'akhir peralihan' acara.
• Webkit: acara 'webkitTransitionEnd' menandakan tamatnya peralihan.
• Mozilla: acara 'transitionend' berlaku semasa tamatnya peralihan.
• Opera: Peristiwa 'oTransitionEnd' menandakan tamatnya peralihan.
• Internet Explorer: Peristiwa 'transitionend' dicetuskan apabila peralihan selesai.

Contoh Pelaksanaan :

Untuk memantau peralihan selesai dalam Webkit, gunakan kod berikut:

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

Nota:

Ketersediaan dan gelagat peristiwa peralihan boleh berbeza-beza merentas penyemak imbas. Oleh itu, adalah penting untuk mempertimbangkan keserasian penyemak imbas apabila menggunakan acara ini.

Atas ialah kandungan terperinci Bagaimanakah anda boleh memantau permulaan dan tamat peralihan CSS3 yang tepat?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!