How to Make a Zoom Parallax using Next.js and Framer Motion
A Smooth Scroll Parallax animation featuring a zoom with a sticky container. Made with React, Framer Motion and Next js. Pictures by Matthias Leidinger. Inspired by https://www.exoape.com/work/plugged-l...
Live demo / Source code:
https://blog.olivierlarose.com/tutori...
00:00 Intro
00:24:12 Overview
1:20:00 Making a sticky container
2:24:29 Adding the first image
3:53:12 Scaling on scroll
5:55:24 Adding the other images
8:59:14 Secret technique
11:15:06 Creating the parallax
12:19:25 Adding a smooth scroll
12:46:29 Outro
More animations: https://blog.olivierlarose.com/
Follow me on Twitter: / olivierlarose_
Discord Channel: / discord
Thanks for watching!
#react #nextjs #awwwards #gsap #framer #motion
Watch video How to Make a Zoom Parallax using Next.js and Framer Motion online without registration, duration hours minute second in high quality. This video was added by user Olivier Larose 31 January 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 27,10 once and liked it 1.3 thousand people.