Why does rotateY (flip) css3 animation flicker in Chrome?

I did jsFiddle: http://jsfiddle.net/Grezzo/JR2Lu/

When you press the i key on the keyboard, the image flips to display the text, but during flip animation it flickers (especially the text flickers) when viewed in Chrome.

(note that I am using a free JS library that does not require a prefix, with CSS properties of the browser.)

Why is it flickering and how can I stop it?

UPDATE: The flicker is noticeable in Chrome 20.0.1132.47 m, running on XP, and whatever the latest version for OS X 10.7.4. Leo (I'm not right next to my Mac to check)

+6
source share
1 answer

Well, that is a little strange. Removing background-color from .card , it works fine: http://jsfiddle.net/JR2Lu/3/

There seems to be a problem with the .card design, perhaps, since you usually don't see this div.

+9
source

Source: https://habr.com/ru/post/919506/


All Articles