Maison > interface Web > tutoriel CSS > Comment éliminer le scintillement pendant les transitions de « transformation » de WebKit ?

Comment éliminer le scintillement pendant les transitions de « transformation » de WebKit ?

Mary-Kate Olsen
Libérer: 2024-12-10 09:47:16
original
255 Les gens l'ont consulté

How to Eliminate Flicker During WebKit `transform` Transitions?

Éliminer le scintillement lors des transitions webkit-transform dans WebKit

Les développeurs Web peuvent rencontrer un scintillement indésirable avant les animations de la propriété webkit-transform. Pour résoudre ce problème :

Cause du scintillement :

Les navigateurs WebKit mettent en cache les images pendant sa couche composite. Avant de lancer la transition, le navigateur doit d'abord déplacer l'élément vers le calque composite, provoquant un scintillement momentané.

Solution :

Implémentez la propriété CSS suivante pour le élément affecté :

-webkit-backface-visibility: hidden;
Copier après la connexion

Cette propriété demande à WebKit d'éliminer le scintillement en rendant la face arrière de l'élément invisible. Par conséquent, le navigateur évite de déplacer l'élément vers le calque composite pour l'animation, résolvant ainsi le scintillement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal