Chapter 4: Build a fancy gallery with advanced scroll animations
Free coding time
This chapter include some free coding time, get ready! 😈
Next Steps
🍚 Sticky situation
Setup the elements & styles for a good start
🧮 Grid layout & styles
Let's build this visual masterpiece!
📶 Progress setup
Setup the scroll progress boundaries
📈 GSAP Timeline setup
Link the scroll progress with a timeline for advanced animations
🧑💻 Free coding time!
Let your creativity speak
🏁 Animating grid items
Our timeline animation breakdown
🎚 Fading Overlays & Mobile tweaks
Desktop overlay
😵💫 Animating the caption
Another part of an animation with different scroll boundaries
💡 Improving axes
What we could do to push things even further
✅ Result
What it should look like at the end of this chapter