Jump to content


Moving Multiple Elements Repeatedly

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'm new to GSAP and also as a note, JS isn't my forte either. I've just started using GSAP recently and I'm trying to figure out how to get the top element to the very bottom and move the other two elements above a bit, and then repeat this animation whenever the top element is clicked. You can see my attempt in Codepen. 


I've tried looking at other Codepens from here: https://greensock.com/forums/topic/15460-timeline-click-to-trigger-animation/ and attempted to integrate it, but I haven't been able to figure it out..


Thank you for the help!

See the Pen vVwLgb?editors=1010 by csc94 (@csc94) on CodePen

Link to comment
Share on other sites

I re-wrote the demo. I would say avoid assigning class to keep track of active elements, it gets messy and confusing real quick.


See the Pen pxmrpR?editors=0010 by Sahil89 (@Sahil89) on CodePen


  • Like 5
  • Thanks 1
Link to comment
Share on other sites

@Devon Bortscher I should have pointed out some problems with your demo before re-writing it.


1. As you already might know, you can use stagger tweens to add uniform delay when animating multiple elements.

2. You are using infinite: true, in GSAP if you want animation to repeat infinitely then you need to set repeat property to -1. But also for what you were doing you didn't need to set any repeat values.


I decided to make a video tutorial explaining how my demo works. It seems like you have already figured, but in case you want to know more you can watch the following video.




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