@Alma410

Где можно увидеть реализацию такого эффекта при скролле?

Приветствую.
Пытаюсь найти реализацию такого эффекта с интерактивного картой при скролле. https://fex.net/ru/s/mrxcrov
Подскажите пожалуйста ресурс где можно ознакомится с реализацией данного эффекта
67424e43a42d0509874538.png
67424e4be6d98523708234.png
  • Вопрос задан
  • 244 просмотра
Пригласить эксперта
Ответы на вопрос 2
Get-Web
@Get-Web Куратор тега CSS
Front-End Developer
Можно создать видео этой анимации и проигрывать его при прокрутке используя locomotive-scroll
Ответ написан
Пару лет назад видел подобную идею, но с прорисовкой подписи человека по скроллу, выглядело достаточно свежо и я тогда пытался разобраться с реализацией. Прямо сходу не вспомню всех нюансов, но тебе точно нужна динамическая прорисовка SVG.
Изучи свойства stroke-dasharray и stroke-dashoffset.
Сначала через svg отрисовываешь нужные линии, а уже JS прорисовывает их в зависимости от процента скролла:
const progress = Math.min(scrollPosition / (documentHeight - windowHeight), 1);
      line.style.strokeDashoffset = totalLength * (1 - progress);
    };
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы