Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
mrpsk

ScrollTrigger with vertical scroll

Go to solution Solved by Cassie,

Recommended Posts

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

Link to comment
Share on other sites

  • Solution

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

  • Like 2
  • Thanks 1
Link to comment
Share on other sites

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!

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×