Jump to content
GreenSock

beavykins

ScrollTrigger callback when all refresh calculations have completed?

Recommended Posts

Is there a way to call a function once ScrollTrigger has finished calculating everything for all timelines on refresh?

 

I couldn’t find anything about it and considered making a simple timeline and setting the refreshPriority to be the lowest, but this timeline wouldn’t be used for anything else so I thought there might be a better way I am missing?

 

Thanks!

Link to comment
Share on other sites

From the docs:

ScrollTrigger.addEventListener("refreshInit", function() { 
  // this code will run BEFORE the refresh 
}); 
ScrollTrigger.addEventListener("refresh", function() { 
    // this code will run AFTER all ScrollTriggers refreshed. 
});

https://greensock.com/docs/v3/Plugins/ScrollTrigger/static.refresh()

 

Happy tweening.

:)

 

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

Wow, how did I miss that!

 

Thanks for the speedy reply.

  • Like 1
Link to comment
Share on other sites

Is there any kind of enforced delay with the refresh event? I just added it and it seems to fire noticeably after everything has refreshed. I wonder if there is some kind of throttle or debounce going on? It may well be something else going on with my implementation though.

 

Thanks again!

Link to comment
Share on other sites

No, there isn’t any delay whatsoever. However, when the viewport resizes on a mobile device WHILE SCROLLING, ScrollTrigger automatically delays the entire refresh (not just dispatching the “refresh” event) until the scroll is done in order to avoid a sudden stop in the momentum scroll. You can, of course, force a ScrollTrigger.refresh() whenever you want. But there is no delay between when a .refresh() happens and when the event gets dispatched.

  • Like 1
Link to comment
Share on other sites

Thanks for the info, I have this hooked up using smooth scrollbar (on desktop), I assume that should mean it is instant?

 

It does seem to be scrolling related, I have a resize observer hooked up to the scroll container which fires refresh when it detects a resize, that happens when things like lazy loaded images pop in. that works nicely for my scrollTriggers but I have something else that relies on the correct position of all the page elements so I am using the refresh event to redraw that, but it doesn’t seem to fire until a little while after I have stopped scrolling if I continually scroll to the bottom.

 

It’s a bit of a complicated setup so I will try and debug it a bit more in case there is something else working against it.

 

Thanks!

Link to comment
Share on other sites

Yeah, that sounds like potentially related to smooth scrollbar (not a GreenSock product). If you still need some help, just post a minimal demo and we'd be happy to take a peek and answer any GSAP-specific questions (we can't support smooth scrollbar, though). 

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