Scroll animations! How to add a flowing path like the Lusion site with SVG and Javascript
As seen on the new Lusion site, scroll animations such as a path that grows as you scroll down a path are effective web design techniques. In this tutorial, Rik shows you how to add your own SVG paths that fill in as you scroll!
00:00 Intro
00:50 HTML and CSS
04:28 Image to SVG
07:06 Javascript
20:11 Outro
Reminder that if you're wanting a more structured approach to learning creative skills, check out our courses over at https://www.superhi.com/
Links:
https://lusion.co/
Demo:
https://superhi-videos.s3.amazonaws.c...
Download:
https://superhi-videos.s3.amazonaws.c...
Photos by Shauna Summers on Death to Stock:
https://app.deathtothestockphoto.com/...
Weather-aware websites: How to add weather data and styling to a website using Javascript
Scroll animations! How to add a flowing path like the Lusion site with SVG and Javascript
