Create a Responsive CSS Motion Path? Sure We Can!

There was a discussion recently on the Animation at Work Slack: how could you make a CSS motion path responsive? What techniques would be work? This got me thinking.

A CSS motion path allows us to animate elements along custom user-defined paths. Those paths follow the same structure as SVG paths. We define a path for an element using offset-path.

.block { offset-path: path('M20,20 C20,100 200,0 200,100');}

These values appear relative at first and they would be … Read article “Create a Responsive CSS Motion Path? Sure We Can!”

The post Create a Responsive CSS Motion Path? Sure We Can! appeared first on CSS-Tricks.