The Framer Motion Scroll Animation Masterclass

Animated UI components for React, Tailwind CSS, Framer Motion & More ✨ https://www.hover.dev There are THREE distinct ways to create scroll based & scroll triggered animations with Framer Motion. With these 3 tools, and a bit of creativity, you can build just about anything you want. Today, we'll see how they all work. #reactjs #javascript #webdevelopment 📚 Video Links Source code: https://gist.github.com/TomIsLoading/4f2c6673d2bb8bdf8307af66d0ad329d Docs: https://www.framer.com/motion/scroll-animations/ 🔗 My Links TikTok: https://www.tiktok.com/@tomisloading Instagram: https://www.instagram.com/tomisloading/ GitHub: https://github.com/TomIsLoading Twitter: https://twitter.com/TomIsLoading Discord & more: https://linktr.ee/tomisloading Portfolio templates: https://tomisloading.gumroad.com/ 0:00 - Introduction 0:10 - The basics using whileInView 1:48 - Stepping it up with the useInView hook 3:12 - The basics of useScroll 4:53 - useScroll with target elements 8:15 - useScroll with a different container element