Jump to content
Search Community

ScrollTrigger feature request: "onSnapInterrupt" callback

CityLights test
Moderator Tag

Go to solution Solved by GreenSock,

Recommended Posts

Hey CityLights. Couldn't you use whatever event causes the interruption instead?

 

The more you're able to show the usefulness of feature requests the more likely we are to seriously consider them. There needs to be enough reason to warrant the extra file size and run time execution cost for all users :) 

  • Like 1
Link to comment
Share on other sites

As explained by @GreenSock, detecting a snap interruption is not so trivial.
 

On 12/22/2020 at 12:47 AM, GreenSock said:

The way ScrollTrigger senses when it must kill the snapping is by checking if the current scroll position is the one that was previously set (or the time before that) by the tween itself. We can't just listen for a "scroll" event or something because those would get dispatched by the snapping itself, and the scrolling may be triggered by various different things (mousewheel, user drags the scrollbar, use JavaScript, touch-scroll on a mobile device, etc.) 


Since a mechanism to determine a snap interruption already exists as part of the library internals, creating application code for the same purpose is simply needless suffering. Not only would it be redundant code, but also painstakingly hard to maintain as it must closely imitate the library internals. So for users who need to detect snap interruptions, the upside of being able to leverage the library internals via the "onSnapInterrupt" hook is immeasurable and saves a ton of technical debt. 

 

On the other hand, the downside for users not using the hook is negligible. They will only suffer the additional runtime cost of a conditional statement checking for the presence of the 'onSnapInterrupt' callback when a snap interruption happens (which depending on the snap duration, is not so common anyways). I can't see such logic being expensive in terms of extra file size either.

Link to comment
Share on other sites

With that approach, I face difficulties on both desktop and mobile.
 

On desktop: since it is not possible to attach event listeners to the scrollbars, only to their associated elements, pointermove events (following a pointerdown event) which happen somewhere on the element but outside of its scrollbar would be mistaken for scrollbar scrolling, unless I made some nasty assumptions about scrollbar width, which can vary from browser to browser. Makes for a very brittle solution.

On mobile: a pointerdownevent followed by pointermove events does not necessarily indicate scrolling. If the events land on a child element with touch-action: none, no scrolling would occur.

Link to comment
Share on other sites

  • Solution

Okay, I updated the beta version of ScrollTrigger 3.6.1 which you can get here: https://assets.codepen.io/16327/ScrollTrigger.min.js and it lets you define onStart, onInterrupt, and onComplete callbacks inside the snap object like: 

snap: {
  snapTo: "labels",
  onStart: self => console.log("started snapping"),
  onInterrupt: self => console.log("interrupted!"),
  onComplete: self => console.log("finished snapping")
}

Let me know if that works okay for you. 

  • Like 1
  • Thanks 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...