Jump to content
Search Community

`cycle` property in .to(), .fromTo() and .from() calls

Tahir Ahmed test
Moderator Tag

Go to solution Solved by GreenSock,

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

  • Solution

Hi Tahir! Well, there are some very specific (and important) reasons that "cycle" only works on the stagger methods and it'd take a while to explain. Suffice it to say that it's primarily a performance consideration as well as an effort to keep the file size of TweenLite minimized. Plus there are some mutability factors. Blah, blah...trust me, I considered it and the tradeoffs were just too costly from an architectural/performance standpoint. 


I really don't consider this much of a limitation, though, because you can always use one of the stagger methods and simply use a stagger value of 0. That'd be almost identical to doing a regular to() call. See what I mean? 


You could even simulate a set() like:

TweenMax.staggerTo([...], 0, {cycle:{...}});

(the default stagger value is 0 anyway, so you can just not pass that parameter in) :)

  • Like 4
Link to comment
Share on other sites

Hey! Thanks for the reply Jack.


Ah! yes of course. I think you are right about using `.stagger..()` methods with `0` duration as a replacement of `.set()` or with `0` stagger value for `.to()` (and other) calls. This has been one of the interesting things, at least for me, about GSAP that there always are numerous ways to achieve the same result.


`cycle` is a powerful addition for me and I just wondered why it wasn't part of the other calls. Thanks for clearing that up.


I suppose `.stagger..()` methods are soon to become my go-to method for a number of things because a lot of times, I am working with loops.


Thanks again for this very useful 1.18.0 update.

  • Like 1
Link to comment
Share on other sites

  • 4 years later...

Hi guys,

when I tried to use cycle property didn't work and give me the warning in the console 
"Invalid property cycle set to {opacity: Array(2), y: Array(1), rotation: Array(1)} Missing plugin? "
what I should Import ?

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...