Jump to content
Search Community

How to properly check for and kill() specific ScrollTrigger instances on resize?

milhouse test
Moderator Tag

Recommended Posts

Hi there, I’ve just started using the ScrollTrigger plugin, which is SO awesome - thank you for all the work put into this. I’m worried I’m over complicating things, especially in regards to making my ScrollTrigger instances responsive.
 

Basically I have 2 ScrollTrigger instances for desktop (anything above 800px) and 1 tween with a ScrollTrigger instance for mobile (anything below 800px). I want the 2 desktop ScrollTrigger instances to only run on desktop and the mobile tween with ScrollTrigger to only run on mobile.
 

Everything works great on initial load for both desktop and mobile, but if resizing the viewport, everything goes a bit whacky/breaks (things go out of place/overflow, and I can’t tell if the instances are duplicating or if just the markers are being repeated). As well, my desktop ScrollTrigger instances won’t run if resizing from mobile and my mobile tween with ScrollTrigger won’t run if resizing from desktop.
 

I’ve been wracking my brain, searching high and low in the docs and forums trying different things for 3 days now, but I’m not quite getting it. Any help would be incredibly appreciated.
 

Thank you so much.

See the Pen yLeMqxg by milhouz (@milhouz) on CodePen

Link to comment
Share on other sites

Hey @ZachSaucier I noticed this is part of an unreleased version of Gsap (3.3.5). This feature is exactly what I'm chasing at the moment also, just wanted to find out roughly how long you would anticipate before this version is released into the wild? :)

 

Thanks!
Elliott.

Link to comment
Share on other sites

Hey @GreenSock, Hey @ZachSaucier,
Thank you so much for your quick replies. This looks awesome and works flawlessly from what I’ve tested. Is this feature still set to launch in the next week or so? Would love to implement it in the current project I was having trouble with regarding the resizing. 


Thanks again for this! Can’t wait to implement it! 😀

  • 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...