Анимировать стрелки и появление блоков при скролле.
Есть дизайн сайта в Figma, в котором есть такой интересный блок высотой примерно в 2.5-3 экрана. Через весь блок проходят большие две стрелки, которые должны анимировано "прорисовываться" при скролле. Появление блоков можно анимировать через простую библиотеку aos.
Адаптация на ваше усмотрение, но нужно также сделать интересно.
С такими анимациями я еще не сталкивался, поэтому буду рад услышать варианты вашей реализации в ставке.

Отзыв заказчика о сотрудничестве с Олександром К.
Анимировать стрелки и появление блоков при скролле.Отличный специалист, конструктивный и четкий в коммуникации. Задачу выполнил вовремя и качественно.
Отзыв фрилансера о сотрудничестве с Михайло Нагорняком
Анимировать стрелки и появление блоков при скролле.Понятные задачи, приятное общение. Буду рад дальнейшему сотрудничеству.
-
Добрый день, готов помочь с анимацией стрелок, если они в формате svg, это не сложно сделать.
-
717 21 2 1 Привет! Интересная задача. Но хотелось бы более подробно ознакомиться с макетом и вот этим всем..
-
1472 15 0 По анимации по сути один "правильный" вариант, чтобы выглядело эффектно. Но, нужно ознакомиться с макетом, как этот блок промальован, плюс в идеале дизайнер должен был сделать адаптивную версию, потому что без перемалевки стрелок адаптив не будет адаптивом, просто уменьшенная версия. AOS нет смысла тянуть для отдельной анимации блоков, все в 1.
Также необходимы уточнения, что уже сверстано, что именно нужно, как, на чем и т.д.
700грн. - малая предложение.
-
262 2 0 Вам нужна верстка страницы?
Или только стрелка?
Если верстка готова, могу написать стрелку как модуль.
Вариантов много. Но не до конца понятно, что значит "промальовываться". Они должны двигаться? Заливаться цветом? Или просто стрелка должна появляться (самый простой вариант)? Или эта метка должна двигаться по стрелке?
-
298 Добрый день, могу попробовать помочь, с адаптацией будет трудновато, так как тут надо подумать, в общем пишите в лс
-
4926 88 0 Добрый день, Михаил
Готов сделать анимацию
Нужно только один блок сверстать?
Пишите в ЛС, обсудим детали
-
Лінк можна для ознайомлення зі структурою?
-
Стрілки через SVG ? Їх можна анімувати через svg path
-
Вибачте за довгу відповідь, прикладаю figma цього блоку, мені по суті потрібна тільки анімація цих стрілок, решту я зможу зверстати сам.
Збоку зображена приблизна мобільна версія (вона буде простою)
https://www.figma.com/design/pj3TeZ2CGuhXoHmas6woNY/Arrows?node-id=1-4&t=3RDQNf0WxCZiAb0P-1 -
Актуальные фриланс-проекты в категории HTML и CSS верстка
Разработка iOS-приложения для онлайн-шахмат аналога (возможно через Vibe Coding)
20 000 UAH
Необходимо разработать MVP мобильного приложения только под iOS. В качестве основы можно взять концепцию Chess.com, но без копирования дизайна или кода. Желательно максимально использовать Vibe Coding/AI для ускорения разработки и снижения стоимости, но код должен быть чистым,… HTML и CSS верстка ∙ 4 часа 28 минут назад ∙ 21 ставка |
Ищем специалиста по ДжумлеВсем привет, есть проект, по которому нужен специалист по Джумле. Сейчас нужно разобраться, как там всё устроено и какие есть страницы. Найти страницу и форму регистрации и рассказать, показать, как всё работает и куда идут заявки и т. д. HTML и CSS верстка ∙ 5 часов 58 минут назад ∙ 19 ставок |
Веб-дизайн и разработкаПривет! Для текущего проекта ищу двух отдельных специалистов: веб-дизайнера (Figma) веб-разработчика (Frontend / WordPress) Проект включает задачи по типу: лендинги, интернет-магазин, админ-панели, сайт на WordPress, а также при необходимости небольшие задачи на React /… HTML и CSS верстка, Дизайн сайтов ∙ 3 дня 7 часов назад ∙ 115 ставок |
Нужен разработчик Drupal для правок на нескольких сайтах.Нужен разработчик Drupal для правок на нескольких сайтах. Сайт раздувается и заполняет весь хостинг .. HTML и CSS верстка, Веб-программирование ∙ 3 дня 15 часов назад ∙ 39 ставок |
Оптимизация скорости сайта WordPress
5092 UAH
полные детали отправим в личные сообщения Цель Максимально ускорить загрузку сайта, особенно на мобильных устройствах. KPI (обязательно) После завершения работ необходимо добиться следующих показателей. Mobile Performance 90+ LCP менее 2.2 сек INP менее 200 мс CLS менее 0.1… HTML и CSS верстка, Javascript и Typescript ∙ 4 дня 5 часов назад ∙ 68 ставок |