Offset-path
Обычные анимации, которые могут лишь изменять размер или делать стандартный поворот на градус уже не столь интересны, но что если я расскажу как можно реализовать исключительно средствами CSS анимацию как на видео.
Машинка движется по заранее нарисованной траектории, хмм.. На самом деле вся магия кроется в свойстве offset-path для которого в SVG мы и задаём тот самый путь в виде кривой.
Код проекта разместил по ссылке: https://jsfiddle.net/lullis/ehvz9xu8/
Можно поклацать и посмотреть как всё работает.
#animation #css
Обычные анимации, которые могут лишь изменять размер или делать стандартный поворот на градус уже не столь интересны, но что если я расскажу как можно реализовать исключительно средствами CSS анимацию как на видео.
Машинка движется по заранее нарисованной траектории, хмм.. На самом деле вся магия кроется в свойстве offset-path для которого в SVG мы и задаём тот самый путь в виде кривой.
Код проекта разместил по ссылке: https://jsfiddle.net/lullis/ehvz9xu8/
Можно поклацать и посмотреть как всё работает.
#animation #css