Jump to content
GreenSock

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

Loop a staggerTo [basic banner]

Recommended Posts

Hello schtals, and Welcome to the GreenSock Forum!

 

You can add repeat:-1 on your TimelineMax constructor

var tl = new TimelineMax({ repeat: -1 });

tl.staggerTo ([f1, f2, f3, f4, f5], 0.15, {opacity: 1}, 5 );

the -1 stands for infinite  repeat

 

repeat : Number - Number of times that the animation should repeat after its first iteration. For example, if repeat is 1, the animation will play a total of twice (the initial play plus 1 repeat). To repeat indefinitely, use -1. repeat should always be an integer.

 

You can find more info about repeat in the TimelineMax Docs:

 

http://greensock.com/docs/#/HTML5/GSAP/TimelineMax/

 

Let us know if you need anymore assistance and Happy Tweening! :)

  • Like 4
Link to post
Share on other sites

To add to Diaco's great advice!

 

You could also just add a empty to() tween between your animations like so:

// to( target, duration, vars)
.to({}, 3, {}) 

you just pass an empty object for the tween target and the tween vars

tl
.staggerTo ([f1_1, f1_2, f1_3], 0.5, {opacity: 1, left:"+=40px"}, 0.25 ) // load in anim
.to({}, 3, {}) // adds a 3 second pause between the two animations
.staggerTo ([f1_1, f1_2, f1_3], 0.5, {opacity: 0, left:"-=40px"}, 0.25 ) // load out anim

:)

  • Like 1
Link to post
Share on other sites

It would be this for jQuery CDN link

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

Found her on Google CDN page:

 

https://developers.google.com/speed/libraries/
 

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.0/TweenMax.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.8.2/jquery.gsap.min.js"></script> 

:)

Link to post
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.

×