Pourquoi mon animation CSS scintille-t-elle sur iPhone et comment puis-je y remédier ?

Animations CSS scintillantes dans iPhone WebKit

Dans une application iPhone, les animations CSS utilisées dans un jeu provoquaient un scintillement. Le scintillement se produisait lorsque les éléments se mettaient en place après avoir défilé. Les seules animations WebKit utilisées étaient pour la transition (soit instantanée, soit en douceur de 0,2 seconde) et la traduction.

En cliquant sur « Faire correspondre les éléments » suivi de « Rejouer », tout l'arrière-plan des accessoires/sacs à main est devenu blanc. lors de l'animation des armes qui défilent.

Solution :

Ajout -webkit-backface-visibility a contribué à réduire le scintillement, mais un scintillement initial a persisté après le rechargement de la page. La solution complète impliquait l'ajout de -webkit-perspective: 1000. Avec cette propriété supplémentaire, le scintillement a été éliminé.

Le code pour résoudre le problème :

-webkit-perspective: 1000;
-webkit-backface-visibility: hidden;

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!