Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
elspoono2

scrollTo within timeline

Recommended Posts

I'm using the following code to automatically scroll a div up & down when the user has not been interacting for a while (idle). 

objListingScrollTween = gsap.timeline({ repeat: -1, repeatDelay: 1, yoyo: true });
objListingScrollTween.add(gsap.to("#sessionListingsHolder", { duration: 5, scrollTo: { y: "max" }, ease: "none"}));

This works fine but I have two questions:

1) is there an inbuilt way of getting the value of  "max" ?

2) when the user interacts, I pause the timeline. When idle resumes I call resume() on the timeline. But the user may have scrolled manually to a different scroll position in which case there is a jump. Is there an inbuilt way to get the value the timeline needs to seek() to in order to restart the timeline from the correct place?

 

thanks

Link to comment
Share on other sites

Hey elspoono2 and welcome.

 

3 hours ago, elspoono2 said:

1) is there an inbuilt way of getting the value of  "max" ?

let maxScroll = document.body.offsetHeight - window.innerHeight;

All you need is JS :) 

 

3 hours ago, elspoono2 said:

Is there an inbuilt way to get the value the timeline needs to seek() to in order to restart the timeline from the correct place?

I don't really understand what you're asking here. It sounds like you're wanting to use some ratio to set the state of the timeline? Usually .progress() is more useful for .seek() for that sort of thing.

  • Like 2
Link to comment
Share on other sites

Hi Zach

Thanks for the "max" js.

As I understand it progress() will give me the current position of the timeline but if the user has manually scrolled the div to a new position this won't match correct?. So maybe I do need a ratio to synchronise the timeline via progress() or seek(). Does that make sense? I guess I could remake the timeline from scratch each time rather than pausing/resuming maybe that would be easier?

Link to comment
Share on other sites

10 minutes ago, elspoono2 said:

maybe I do need a ratio to synchronise the timeline via progress() or seek(). Does that make sense?

Yep, that was what I was suggesting :) .progress() makes it easier because you just need the ratio. 

 

10 minutes ago, elspoono2 said:

I guess I could remake the timeline from scratch each time rather than pausing/resuming maybe that would be easier?

I can't say given you haven't shared your setup. That is an option if it works, hah.

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

×