A web animation tutorial on how to make a 3D earth rotate on scroll, with a clip path animation using Three.js, Framer Motion and Next.js. Inspired by https://minhpham.design/
Join the Creative Menu Challenge: / discord
Demo / Source code: https://blog.olivierlarose.com/tutori...
00:00 Intro
00:32 Earth Component
00:51 Earth Texture
1:20 Rotate on Scroll
1:59 Lazy Loading
2:08 Text Clip on Scroll
2:55 Text Clip on Hover
3:35 Outro
More animations: https://blog.olivierlarose.com/
Follow me on Twitter: / olivierlarose_
Discord Channel: / discord
Thanks for watching!
#react #nextjs #awwwards #gsap #framer #motion #svg #morph
Смотрите видео Build a Smooth Scroll 3D Earth using Three.js, Framer Motion and Next.js онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Olivier Larose 08 Сентябрь 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 16,771 раз и оно понравилось 700 людям.