Jump to content
Search Community

TimelineMax - change values on repeat

chapolote test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I want a timeline which sets an element on repeat in different positions.


What I did is to set variables to a random start- and end-value for y-position and use this values in my timeline. In my timeline I set the start-point of the element,  then the element moves to right, then it's positioned to another random y-value as end-position and then it moves back left. On repeat of the timeline, I call a function which sets the variables of my start- and end-position on a new random value.

But it seems as on repeat always the initial definitions of my variables are used and not the new calculated values. How can I achieve, that the new calcuated values of my variables are used in my timeline?

See the Pen PEbjdJ by chapolote (@chapolote) on CodePen

Link to comment
Share on other sites

Tweens cannot be changed once they are defined. You will have to regenerate the tween when it completes or you can use modifiers plugin to achieve same thing but changing too many values will make your code complex because you will need to write callback function for each property.


Following threads discuss same ideas, you can find examples for both approaches.


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