Problem with loading GSAP initity marquee after loading AJAX page.

[Dave-P]

Hello everyone!

I'm totally new to programming and GSAP and I guess there may be a few things in my code that could be done better, but in general everything works fine on the page except going from subpage in /work to subpage also in /work folder (e.g. from /work/project-1 to /work/project-2). In this case, the marquee infit function is not dragabble and loops badly. When we go to /about and then back to /work/project-2 everything works fine.

Pages in the project are loaded AJAX and I know that's the problem because when we enter the page via standard loading, everything works fine. Unfortunately, I can find the error. The problem is with runCaseGSAP() function.

Can you guys help me? 🙏

 

I'm attaching the code only for Javascript, I hope it's enough because the problem occurs when switching between pages and I would have to upload almost the entire page here 😅🤔

See the Pen mdQOPed by dawidpolaniewski (@dawidpolaniewski) on CodePen

[GSAP Helper]

Hello there,

 

the code you provided is more than a thousand lines long - that is just too much to comb through to get to the gist of your problem. And unfortunately it's pretty tough to troubleshoot without a minimal demo that is clearly showcasing your problem - the issue could be caused by CSS, markup, a third party library, your browser, an external script that's totally unrelated to GSAP, etc.

Would you please provide a very simple CodePen or CodeSandbox that demonstrates the issue? 

 

Please don't include your whole project. Just some colored <div> elements and the GSAP code is best (avoid frameworks if possible). See if you can recreate the issue with as few dependancies as possible. If not, incrementally add code bit by bit until it breaks. Usually people solve their own issues during this process! If not, then at least we have a reduced test case which greatly increases your chances of getting a relevant answer.

 

Here's a starter CodePen that loads all the plugins. Just click "fork" at the bottom right and make your minimal demo: 

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

 

If you're using something like React/Next/Vue/Nuxt or some other framework, you may find StackBlitz easier to use. We have a series of collections with different templates for you to get started on these different frameworks: React/Next/Vue/Nuxt.

 

Once we see an isolated demo, we'll do our best to jump in and help with your GSAP-specific questions.