Pa3k.m
Pa3k.m

Reputation: 1156

css-transform animation causing to flickering

My code is in here http://jsfiddle.net/JaB5S/

You can click the blue page to run the animation.

But whenever you do though, you can see the texts flickering until the animation is done. The text on the right side even disappears.

I've read somewhere that backface-visibility: hidden; should solve the problem, but I already have it but still cant fix it.

This is my first time working with css animations so any help would be very much appreciated.

Thanks!

Upvotes: 3

Views: 258

Answers (1)

valerio0999
valerio0999

Reputation: 12138

what you need is adding

-webkit-transform-style: preserve-3d;

to #main-container, I updated your fiddle: http://jsfiddle.net/JaB5S/2/

Upvotes: 3

Related Questions