Anybody here done JS animations with GSAP, ScrollMagic, and Barba.js?

Has anyone done JS animations with GSAP, ScrollMagic, and Barba.js? If so, I wonder why the bottom animation on the home page is flakey on the first or second time that you scroll down. I am using ScrollMagic for that and I have no idea why it’s doing this. I have not really changed much from the tutorial, yet. I only added a few animations that are not in the tutorial. The main issue is that the phone icon animation bounces again, either vertically or horizontally, when it’s in a regular or mobile view, respectively. This is the Heroku App link and they sometimes take about 15 seconds to load when they are asleep. Thanks for any help.

I’m not a user of the libraries but it looks like maybe the tweening is broken. I’m guessing it might be some interaction (or incorrect usage) of the two libraries ScrollMagic/GSAP (Troubleshooting)

GSAP has released its own ScrollTrigger plugin, so I’d suggest using that instead of ScrollMagic if you can.

1 Like

@lasjorg thanks a lot! I think the issue was between two of my ScrollMagic scenes. I removed the offset and changed the duration of the middle scene in mobile view and now the bottom one is working much better! I could still bring the bug up if I scroll up and down pretty fast, multiple times, but this is probably not a real world scenario. Thanks again!