Mengapa Peralihan webkit-transform Saya Berkelip, dan Bagaimana Saya Boleh Membetulkannya?

Menghapuskan Flicker dalam Peralihan webkit-transform

Walaupun mencapai kesan animasi yang diingini menggunakan webkit-transform, anda menghadapi kelipan singkat sejurus sebelum peralihan. Artikel ini meneroka punca isu ini dan menyediakan penyelesaian untuk mengurangkan kelipan.

JavaScript yang anda gunakan untuk mengubah suai sifat webkit-transform nampaknya betul. Walau bagaimanapun, penyelesaiannya terletak pada menangani aspek pengisytiharan CSS.

Seperti yang dinyatakan dalam urutan perbincangan yang berkaitan, menambahkan sifat CSS berikut pada elemen yang terjejas menyelesaikan kelipan:

-webkit-backface-visibility: hidden;

Sifat ini mengarahkan penyemak imbas untuk tidak memaparkan muka belakang elemen semasa peralihan, menghalang kelipan yang disebabkan oleh perubahan mendadak dalam elemen kedudukan.

Atas ialah kandungan terperinci Mengapa Peralihan webkit-transform Saya Berkelip, dan Bagaimana Saya Boleh Membetulkannya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!