2016-07-11 11 views
0

Ich habe eine Kopie meines Codes auf Codepen, um das Problem besser zu zeigen.CSS-Transformation Animation Problem auf Safari vs Chrom

Die Animation funktioniert gut auf Chrom, aber nicht auf Safari.

http://codepen.io/prismosoft/pen/akVzQg

Ich beantrage eine Skala an den Wrapper Hintergrund div verwandeln, während der Schieber dreht, und schob mit translateZ zurück. Nun, obwohl der Pusher eingestellt ist auf:

Ich möchte den Wrapper Hintergrund hinter dem Drücker als Hintergrund bleiben. Warum verhält sich Safari nicht wie Chrom? Fehle ich etwas?

+0

Es gibt einen Grund, warum Sie jQuery verwenden, um '' Hover' 'zu machen und eine gut gestaltete Timing-Funktion für den Übergang kann das machen? – abluejelly

+0

Der hier verwendete Code dient lediglich der Erläuterung des Problems und wird nicht in der Produktion verwendet. Ob mit reinem CSS oder Javascript, das Hauptproblem ist, dass das Animationsverhalten auf Safari anders als chome ist und ich frage mich warum? Wie kann ich sicherstellen, dass der Wrapper während der Safari-Safari hinter dem Drücker bleibt? – PrismoSoft

Antwort

0

Endlich fand ich das Problem albern mich! Da der Wrapper bg div innerhalb der Wrapper Div ist, die eine Perspektive von 1500px hat. Das Problem wird gelöst, indem einfach der Wrapper bg außerhalb des Wrapper div verschoben wird.