Jump to content
Search Community

Remake timeline on the fly on resize

martis test
Moderator Tag

Recommended Posts

Hi all,

 

Working with a gsap timeline in react as a `useRef` and wanted to know the best way to go about handling resize.

 

Right now I am remaking the timeline on resize, but I am having to record its current progress and set it back to that progress if the animation is currently running.

 

Is there a better method than totally remaking the timeline to "update it on the fly" based on new screen dimensions without using xPercent, yPercent?

Link to comment
Share on other sites

Hm, could you explain a little more about the "why" behind what you're doing (your goal) or better yet, provide a super simple reduced test case in codepen so we can see for ourselves? The way you're doing it may very well be the best way, especially if you're going to NEW values on each resize. I just want to make sure I understand properly.

  • Like 1
Link to comment
Share on other sites

4 hours ago, martis said:

the xPercent, yPercent is working well and it seems to be updating correctly on resize. Can you give me any insights into when and how often those values are being calculated? Thanks!

Glad it's working well for you. In terms of how things are calculated, GSAP simply sets the value whenever the tween updates, which is typically about 60 times per second, but it doesn't constantly update it after the tween is done or anything like that. 

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