Einstellung -webkit-perspective verwischt ipad3 screen

Question

Wenn Sie die webkit-Perspektive CSS-Eigenschaft auf einem iPad3 festlegen, werden untergeordnete Elemente sehr unscharf dargestellt, wie bei der Darstellung von Bildern, die nicht für Retina-Displays verwendet werden. Um klar zu sein, ich spreche nicht über Bilder Rendering verschwommen, DOM Kind Elemente sind verschwommen.

Was kann dagegen getan werden?

Das einfache Entfernen der Eigenschaft ist keine Option, da ich Animationen verwende, die Bewegung in der Z-Achse erfordern.

Eigentum ist, wie dies in CSS gesetzt:

-webkit-perpective: 500; 

Vielen Dank für jede Hilfe zu diesem Thema!

Answer 1

Nicht sicher, ob dies helfen wird, aber es gibt eine Erwähnung dieser Art der Sache in diesem Artikel von Front-End-Gott David DeSandro unter dem Abschnitt „Zurückkehren zu der Z-AXIS ORIGIN“:

http://24ways.org/2010/intro-to-css-3d-transforms

Um 3-D-Transformationen bissig zu halten, setzt Safari das Element zusammen, wendet dann die Transformation an. Folglich bleibt das Anti-Aliasing für Text , was auch immer es war, bevor die Transformation angewendet wurde. Wenn vorwärts umgewandelt in 3-D-Raum, können erhebliche pixelation auftreten ...

... die Verzerrung zu beheben und Pixel Perfektion unserer #cube wiederherstellen, können wir die 3-D-Objekt zurück schieben, so dass Die Vorderseite wird zurück zum Ursprung der Z-Achse positioniert.

#cube { -webkit-transform: translateZ(-100px); }