Animations break layer order in Safari bug

Aaronru1 · January 11, 2018, 9:56pm

When I open my site in Safari the mouse over animation overrides the layer order and lets the background go through the foreground layer. I tested it on Firefox and chrome is it works fine there.

I have two animations on the background, one that increases scale on mouse hover and one that does a 3d effect with mouse move over element. I tried removing them one and a time and the issue persists so it is not a conflict with them. I also have some custom javascript that is active on mobile which I tried removing as well to no avail.

Untitled

Here is my site Read-Only link: https://preview.webflow.com/preview/aaronrudyk?preview=17afa220643194a1adca8a94f04e24e9

Here is my live link: http://aaronrudyk.webflow.io/

Cricitem · January 11, 2018, 9:54pm

Safari is the new IE7.

You can fix it by doing a transform forward 50px on the z-axis and a .9 scale transform.

Aaronru1 · January 11, 2018, 9:54pm

Sir you are a gentlemen and a scholar. Thanks!

system · March 13, 2018, 6:57pm

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.