See the Code - See it Full Page - See Details
Initial Houdini exploration: Viewable in Chrome Canary 10/2017 with Experimental Web Platform flag enabled). Allow Custom Properties that can be represented by a simple syntax (like a length, number, or angle) to be animated. Here we take a transform with four functions (a scale, translateX, translateY, and a rotation)... based on three custom properties. A keyframe animation modifies only the custom properties. But that's not all! There are actually two animations... One affecting the translate, and the other affecting the scale and rotate. Both animations are respected, much as they are when [combining custom properties, transform, and transitions](https://danielcwilson.com/blog/2017/02/individual-transforms/)
This Pen uses: HTML, CSS, JavaScript, and