Движение по траектории в CSS помимо «большой тройки» свойств
Перевод статьи CSS Motion Path beyond the Big Three Properties с сайта danielcwilson.com, опубликовано на css-live.ru с разрешения автора — Дэна Уилсона.
Хотя работает она только в Chromium-браузерах, а черновик ее спецификации всё еще активно разрабатывается, анимация движения по траектории (CSS Motion Path) немного повзрослела за эти три года с момента первой реализации в Chrome 46.
Я уже описывал основы главного применения CSS Motion Path в виде трёх свойств — offset-path
, определяющее траекторию, вдоль которой может двигаться элемент, offset-distance
— для позиционирования элемента на этой траектории, и offset-rotate
, которое отвечает за то, какой стороной вперед движется элемент по траектории.
После того моего обзора спецификация подросла на несколько фич (и больше того, некоторые из них уже можно «пощупать» в Chrome). Чтобы увидеть последние возможности, откройте эту статью с её демо-примерами в Chrome 66+ с включенным параметром «Экспериментальные функции веб-платформы» в chrome://flags.