Thanks for inspiring my CSS implementation.

Question

Thanks for inspiring my CSS implementation.

abacaj opened this issue 9 years ago · comments

Aleksei · Answer 1 · Thu Jul 16 2015 18:07:06 GMT+0800 (China Standard Time)

Nice @abacaj ! But you used only start end transform. For smooth and pixel perfect animation you have to use intermediate transforms and custom timing function.

Anton Bacaj · Answer 2 · Tue Jul 21 2015 10:51:19 GMT+0800 (China Standard Time)

Update: I didn't have vendor-prefixes enabled view it again: http://codepen.io/abacaj/full/bdKPEz

Hey @AlexeyBelezeko Can you provide more details? I am not sure what you mean by only start & end transform?

I am also using custom timings like so:

transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1);
transition-delay: 0.25s, 0s, 0.25s, 0s, 0s;

As far as I know the custom timing function is cubic-bezier, which I used.

What browser are you using? On chrome it performs just like your Gif animation.