Jump to content
GreenSock

Tom

Tween through array for values

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

var array = ['1','2','3'];
TweenMax.to('foo', 3, {foo:array});

I would think staggerTo would work... is there a way to increment through an array with just one line like this?

Link to comment
Share on other sites

Hi Tom :)

 

If I understand your question correctly, I think you may be looking for the cycle property of a stagger tween.

 

http://greensock.com/docs/#/HTML5/GSAP/TweenMax/staggerTo/

 

Here's a GreenSock pen of cycle in action:

 

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

 

Hopefully that helps. 

 

Happy tweening.

:)

  • Like 2
Link to comment
Share on other sites

I'm a little confused by your question.

 

If you are trying to animate multiple values on the same target in a single tween, you can use the BezierPlugin

var foo = { bar: 2 };

var values = [{ bar: 5 }, { bar: 2 }, { bar: 10 }];

TweenLite.to(foo, 1, { bezier: { values: values, curviness: 0, timeResolution: 0 }});

See the Pen 12ec99a0947c43c517dd79deb7356aeb?editors=0010 by osublake (@osublake) on CodePen

  • Like 2
Link to comment
Share on other sites

@OSUblake
 

Here's what I mean: 

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

 

I hope I gave someone a good laugh at this attempt. But does GSAP have any feature to automatically run through an array of values like that?

Link to comment
Share on other sites

Not for the same element. If they were different elements you could use cycle, like PointC mentioned.

 

But it's easy enough to loop through an array. Here's a couple different ways you could do that.

See the Pen ZOkLdY?editors=0010 by osublake (@osublake) on CodePen

  • Like 2
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.
×