Jump to content
Search Community

Continuous Loop

jawsh007 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

Hi,

 

I'm new to TweenMax/GSAP. I've done a few animations that have come out great. I'm working on one in particular that I could use some help. 

 

I have two elements that start tweening from the middle of the page. They need to go right till they are off screen and reappear from left and continue tweening in a loop.

 

Any ideas?

 

 

Thanks!

  • Like 1
Link to comment
Share on other sites

Hi and welcome to the GreenSock forums.

 

What you can do here is create 1 tween that animates the object from left to right across the full width of the screen.

Then jump to the middle of the tween by setting progress(0.5).

 

In the demo below I paused the tween at a progress(0.5) so you can see the box in the middle. Clicking on the document plays the tween.

The pausing is optional you could just set the progress immediately and have it play from there.

var t = TweenMax.fromTo(".green", 1, {x:-50}, {x:400, ease:Linear.easeNone, repeat:-1});
t.progress(0.5).pause();

document.onclick=function() {
  t.play();
}

 

 

See the Pen bRqmYr by GreenSock (@GreenSock) on CodePen

 

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

  • 1 year later...

I'm new to Greensock, but am glad there is an awesome community.  This was a great answer and I learned a lot from it.

 

Another related question though.  What if I wanted to have a continuous stream of boxes (instead of just 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...