ScrollTrigger with vertical scroll

[mrpsk 6 Likes (Newbie)]

Hi there!

I took this codepen from the Examples: CodePen Home Infinite Scrolling Cards with GSAP and ScrollTrigger (continuous snap) (

See the Pen LYRwgPo?editors=0010 by GreenSock (@GreenSock) on CodePen

) and I'm trying to adapt it to show some images to make an "About Us" section with all team members.

So right now I wrote my progress at this codepen -> 
I'm having some trouble in those topics below:
- In the start, I don't want to show the previous members (since I disabled the infinite scrolling mode), so I'm trying to make it start with the left side of the screen in blank (so the text can be properly displayed too).
- I want to end the scrolltrigger when the list of members end. Right now I'm having a loop issue that continues after the last member of my list.
- I want to change the spacement between the cards to put them side by side (and don't fade away), any tips?

Someone can help me to find out where I can made some changes in my JS file?

Thanks in advance!

See the Pen yLzRroG by mrpsk (@mrpsk) on CodePen

[Cassie 5,136 Likes (Superhero)]

Hey there!

 

This is a pretty complex demo. It's solving a lot of problems that you don't need solved for your use case.

 

Maybe it would help to start over with a simpler starting point? Something like this?

See the Pen RwLeXEL?editors=1010 by GreenSock (@GreenSock) on CodePen

[mrpsk 6 Likes (Newbie)]

15 hours ago, Cassie said:

Hey there!

 

This is a pretty complex demo. It's solving a lot of problems that you don't need solved for your use case.

 

Maybe it would help to start over with a simpler starting point? Something like this?
 

 

Hi Cassie!

Thank you so much for your input, indeed it was pretty complex for my use case. But now I studied about the codepen you made and the concepts are more clear to me, now I can make some adjustments and learn more about this awesome lib.

Have a nice day!