A rather geeky/technical weblog, est. 2001, by Bramus
So, you’ve found a custom easing function defined in JavaScript. Great! But how do you use that with the Web Animations API (WAAPI)? Turns out that’s more difficult than you’d first expect it to be.
In this episode of HTTP 203, Jake and Surma talk about easing in CSS. You can ease-in, you can ease-out, but CSS doesn’t let you bounce. Jake and Surma chat about a proposal to fix that. After first going down the rabbit hole of creating a (now-abandoned) proposal to define custom easing functions, Jake went …
Continue reading “Bringing Bounce and Elastic easing to CSS”
bezier-easing provides Cubic Bezier Curve easing which generalizes easing functions (ease-in, ease-out, ease-in-out, …any other custom curve) exactly like in CSS Transitions. Pass in the 4 points of the bezier curve of your liking – just like you’d use when defining a CSS Transition Timing Function using cubic-bezier() – and then project x, ranging from …
Continue reading “bezier-easing – cubic-bezier implementation for your JavaScript animation easings”
