react-card-flip icon indicating copy to clipboard operation
react-card-flip copied to clipboard

Published 20 hours ago • verified publisher icon AaronCCWong

Jank with Safari

Open ghost opened this issue 6 years ago • 1 comments

You demo works fine on Safari, but my code does not. I see rendering faults while the card is flipping, as if backface-visiblity:hidden isn't working.

P.S. I slowed the speed down and was surprised to see that as the card is flipping to the back side, the front side is upside down, but only on Safari.

no issues on Chrome.

I switched to a fork: https://github.com/kennethormandy/react-flipcard which works on Safari. Unfortunately, the animation style is missing some sweetness you have in yours, and I could not figure out what it was. So I really hope you get this working on Safari.

ghost avatar Dec 14 '18 19:12 ghost

UPDATE: to fix the above problem, all I had to do was assign this style rule to .react-card-front and .react-card-back: "transformStyle: initial".

ghost avatar Dec 15 '18 18:12 ghost