@djabrail92

Как сделать сгибающие блоки при наведении, как здесь waaark.com/?

Кажется на greensock разработана. Не могли бы скинуть ссылку на какой нибудь пример
  • Вопрос задан
  • 817 просмотров
Пригласить эксперта
Ответы на вопрос 3
Ronnie_Gardocki
@Ronnie_Gardocki
Я у мамы фронтендщик.
У них это сделано на канвасе. То есть 3 бэкграунда для блока просто фоном сделаны канвасом, который реагирует на движения мышью. Есть конечно вариант сделать такое на свг, но там могут быть проблемы с адаптивностью и сохранением адекватного aspect ratio (даже со спец атрибутами viewBox и preserveAspectRatio можно будет помучаться).
У меня имеется несколько демок с похожим эффектом (на свг):
codepen.io/suez/pen/emjwvP - вот тут простой drag effect, который просто меняет одну координату арки.
codepen.io/suez/pen/epgZjK - вот тут более продвинутый пример, где я уже юзаю Cubic Bezier Curve, а не арку или квадратичную Безье.
У меня варианты на rAF велосипедах, с гсапом это все дело должно быть явно проще.
Ответ написан
Комментировать
@djabrail92 Автор вопроса
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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