I think I figured it out after wrestling with it for a few hours. Basically I had to make new ScrollTriggers that pin every group of n cards on top of the screen, alongside those that pin the cards in each group at their respective y coordinates. The math got kind of confusing but luckily I worked my way through it. If anybody asks me to explain the code though,... 🏃♂️🏃♂️
I also made it dynamic so that the number of cards shown at once can be replaced just via the cardCount variable. I don't know if this is the cleanest code (maybe there is a way to make it even more compact), but this does exactly what I want it to do. Thank you @darkus again for the nudge in the right direction 😀 Would still love to see if anybody has a cleaner solution to this problem!
See the Pen BaGZGxj by Kiet-Nguyen-the-bashful (@Kiet-Nguyen-the-bashful) on CodePen
