Samaritan Posted April 19, 2021 Share Posted April 19, 2021 Hello, We have an animation that is being constructed with a timeline, it has several child timelines but I'm not sure that is relevant to my question. I want the animation to be controlled by scrolling, which we are using a scroll trigger for, but we also want it to play by itself (i.e. the user clicks go and it plays through), if it's playing by itself and the user scrolls we want the animation to speed up a bit. Which I think the scrub property on the scrolltrigger with a number does. Is there an official way to handle that or will we need to code in a bunch of if and when and thens? Thanks for your help Link to comment Share on other sites More sharing options...
mikel Posted April 19, 2021 Share Posted April 19, 2021 Hey @Samaritan, Welcome to the GreenSock Forum. Does this example match your expectations? See the Pen vYKqvvz by mikeK (@mikeK) on CodePen Happy scrolling ... Mikel 2 Link to comment Share on other sites More sharing options...
mikel Posted April 19, 2021 Share Posted April 19, 2021 Here is another great ScrolloMeter on offer! See the Pen c1099fe6d3d8c43ec2b928f006551450 by mikeK (@mikeK) on CodePen Happy super scrolling ... Mikel 2 Link to comment Share on other sites More sharing options...
GreenSock Posted April 20, 2021 Share Posted April 20, 2021 13 hours ago, Samaritan said: I want the animation to be controlled by scrolling, which we are using a scroll trigger for, but we also want it to play by itself (i.e. the user clicks go and it plays through), if it's playing by itself and the user scrolls we want the animation to speed up a bit. It would be logically impossible to have the scrollbar control the progress (scrubbing) AND be able to play it independently and have it synchronized properly. That'd sorta be like clicking the "play" button on a YouTube video but not have the progress scrubber move at all while playing, and then expecting that people could grab the scrubber to accurately control it too. If the video is 70% done but the user grabs the scrubber from the very start (because it hasn't moved at all, out-of-sync), what would you expect to happen as a user? If it picked up the progress from wherever it's at, that'd mean it'd suddenly become impossible to ever make it go back to the beginning. But you could totally accomplish what you're asking if you just animate the scroll position to "play" the animation (like auto-scrubbing it). That'd keep everything perfectly synchronized. Here's a simple demo: See the Pen JjEmPZe?editors=0010 by GreenSock (@GreenSock) on CodePen Does that answer your question? 1 Link to comment Share on other sites More sharing options...
Samaritan Posted April 20, 2021 Author Share Posted April 20, 2021 Thanks all, great forum and community support! Jack - I take your point and I was trying for that but couldn't get it going, thanks for the sample as this has helped me get it very close to what I'm expecting. I'm now looking into starting the automated scroll up again once the scrub of scrolltrigger has finished and I think that will take it across the line. Cheers! 1 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