Jump to content
Search Community

Infinite horizontal scroll (infinite loop)

raumzeit test
Moderator Tag

Go to solution Solved by Rodrigo,

Recommended Posts

We love helping with GSAP-related questions, but unfortunately we just don't have the resources to provide free general consulting, logic troubleshooting, or "how do I rework this demo to work in a different way?" tutorials. Of course anyone else is welcome to post an answer if they'd like - we just want to manage expectations.  

 

You are welcome to post in the "Jobs & Freelance" forum for paid consulting, or contact us directly. 

 

Tip: by default ScrollTrigger uses the main page as its "scroller", but it looks like you're using a <div> as the scroller, so you'll need to tell your ScrollTrigger to watch that one. Like scroller: "#div_block-782-33". And your CodePen doesn't even load GSAP or ScrollTrigger. It looks like you're writing a lot of code manually that you could simplify with loops and just structuring your markup differently (you don't need an id for everything). And like in that original demo, you'll need to dynamically create and add new elements to the DOM (your demo doesn't look like it's doing that at all). 

 

Good luck!

Link to comment
Share on other sites

  • Solution

Hi,

 

There are a few issues with your code. The example you're trying to emulate is adding just one element at a time, you are adding all the elements and also you are cloning them, which could create a problem with selectors, especially IDs. Also you are using the update method which is intended for a different situation. You should run the refresh method to recalculate the ScrollTrigger instance's start and end positions. Also in the case that you could have more ScrollTrigger instances in your site, just call the refresh method for that specific instance, especially if adding new elements doesn't affect the start and end points of other ScrollTriggers.

See the Pen wvjjrKK by GreenSock (@GreenSock) on CodePen

 

Happy Tweening!

  • 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.
×
×
  • Create New...