2 ms·
I normally write my CSS transitions [1] at 3-5x the time they will be in the final version. So if I intend for `transition: all .3s ease`, then I'll write `tran
by franciscop 9y ago
I normally write my CSS transitions [1] at 3-5x the time they will be in the final version. So if I intend for `transition: all .3s ease`, then I'll write `transition: all 1s ease` and test it like that. I actually try different speeds, first a decent one (2-3x) not to be slowed down and then a slower one (~5x) to make sure it is works as intended. I've found this much easier to debug and find issues.
The only problem with this approach is that, since you are making things in slow motion, it's easy to over-animate things and make it look messy on normal speed. So just compensate for that and everything is fine.
[1] example: https://picnicss.com/ https://picnicss.com/
- systoll 9y agoChrome's devtools let you set all animation to run at at 1/4 or 1/10 speed, simplifying that process a bit. https://developers.google.com/web/tools/chrome-devtools/inspect-styles/animations https://developers.google.com/web/tools/chrome-devtools/insp...