David Aragon Posted January 10, 2021 Share Posted January 10, 2021 I'm trying to use "onUpdate" to trigger a very short animation when a user scrolls. I noticed that my animation is triggered over 10 times every time I scroll, so I used the console and it does log multiple times... I tried to combine with onComplete: kill/clear/pause but it stops the animation and it doesn't start again. Is there a way to trigger the animation just "while" I'm scrolling? I tried a wheel event function to trigger the animation and it didn't work either. See the Pen KKgBLae by Nkozi (@Nkozi) on CodePen Link to comment Share on other sites More sharing options...
GreenSock Posted January 10, 2021 Share Posted January 10, 2021 I'm not sure what you mean by "every time I scroll" - were you under the impression that onUpdate would only be called once between the time you start scrolling and stop? That's not how it works. Try adding this to your codepen: window.addEventListener("scroll", () => console.log("scroll")); You'll see that the browser fires a scroll event at least once every time the screen refreshes as the result of a scroll, so this can happen 60+ times per second. And of course ScrollTrigger updates based on scroll events as well (though it throttles them so they don't happen more often than the screen refreshes because that'd be wasteful). If your goal is to fire an animation each time the user stops scrolling, you could just do this: ScrollTrigger.addEventListener("scrollEnd", myFuncTL); See the Pen bfb57618c711a1e8beaa1d8668f9aa79?editors=0010 by GreenSock (@GreenSock) on CodePen Or are you literally trying to make an animation play only while the user is actively scrolling? You can do pretty much anything you want using ScrollTrigger - I just don't quite understand the goal here. Perhaps you should look at the "scrub" property. 4 Link to comment Share on other sites More sharing options...
Solution mikel Posted January 10, 2021 Solution Share Posted January 10, 2021 Hey @David Aragon, Welcome to the GreenSock Forum. 'Trigger the animation just "while" I'm scrolling': Do you expect this effect? See the Pen GRjXgRL by mikeK (@mikeK) on CodePen Happy tweening ... Mikel 4 Link to comment Share on other sites More sharing options...
David Aragon Posted January 10, 2021 Author Share Posted January 10, 2021 This is perfect, thank you so much both of you 😍 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now