Lösung für das Jitter-Problem beim CSS3-Transformationsübergang

transform: scale(); Skalierung verursacht Jitter im IE-Browser

Die Transformationsskalierung verursacht Ruckeln im IE-Browser. Sie können während der Skalierung eine Rotation hinzufügen.

wie:

transformieren: Skalierung (1,2);

Ersetzen durch:

transformieren: skalieren (1,2) drehen (0,1 Grad);

transform:translate(); Offset macht das Bild oder den Text unscharf

Der Transform-Offset kann auch dazu führen, dass Bilder oder Texte ihren Rahmen verlieren und unscharf werden. Sie können clac verwenden, um dieses Problem zu lösen.

wie:

transformieren: übersetzen (-50 %);

Ersetzen durch:

transformieren: übersetzen(berechnen(-50% + 1px));

clac ist eine berechnete Eigenschaft von CSS3, die in Berechnungen in Stilen verwendet werden kann. Die Syntax von clac lautet: clac(Zahl + Zahl).注：這里“運算符號”兩端的空格不能少

Transform ist kompatibel. Der IE-Browser ist nur mit IE 9 kompatibel. Die kompatible Schreibmethode ist:

transformieren: skalieren (1,2) drehen (0,1 Grad);
-ms-transform:scale(1.2)rotate(0.1deg); /* IE 9 */
-moz-transform:scale(1.2)rotate(0.1deg); /* Firefox */ 
-webkit-transform:scale(1.2) rotate(0.1deg); /* Safari und Chrome */ 
-o-transform:scale(1.2)rotate(0.1deg); /* Opera */

Dies ist das Ende dieses Artikels zur Lösung des CSS3-Transformationsübergangs-Jitterproblems. Weitere Informationen zum CSS3-Transformationsübergangs-Jitter finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!