@mantyr
Пишу много Golang кода с удовольствием:)

Как делать такой вид анимации (метаморфозы) на css/js в html5?

Интересуют руководства, книги, статьи, библиотеки, алгоритмы на тему того как превращать один визуальный элемент DOM в другой с плавными изменениями внешнего вида и изгибающимися контурами.

На данном примере видим как изменяются:
  • кнопка в график
  • график в другую кнопку
  • кнопка в селектор с прокруткой

При этом контуры плавно меняют свои очертания не классической (линейной) анимацией.
88dabaaa1dbb44fc8d8c3c32dd1ce48e.gif

Использовать планирую в html5 сайтах, не в мобильной разработке, хотя и для неё будет материал полезен.
  • Вопрос задан
  • 541 просмотр
Пригласить эксперта
Ответы на вопрос 2
xmoonlight
@xmoonlight
https://sitecoder.blogspot.com
Явно что SVG + создание динамических полигонов на основе динамики движения при трансформации. Т.е. явно используется библиотека для построения такого интерфейса.
greensock.com/morphSVG
noeticforce.com/Javascript-libraries-for-svg-animation
Ответ написан
Symphony
@Symphony Куратор тега CSS
Используйте SVG.
Наглядный пример.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы