reworked
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by reworked
-
-
First of all, love GSAP. You guys have done an awesome job, it's a very enjoyable API to work with.
Now, my question: How can I ensure my timeline properly adds duration for a function added with call() so that it calls the function in sequence?
For example:
var mainTl = new TimelineMax(); mainTl.addLabel('start') .to($('h1'), 0.5, { y: '-=30px', autoAlpha: 1, ease: Power2.easeOut }, 'textIn') .to($('p'), 0.5, { y: '+=30px', autoAlpha: 1, ease: Power2.easeOut }, 'textIn') .call(myFunction, ['param1', 'param2']) .call(myOtherFunction, ['param1', 'param2']); function myFunction(element, duration) { return TweenLite.to(element, duration, { scale: 1, ease: Back.easeOut }) } function myOtherFunction(element, duration) { return TweenLite.to(element, duration, { scale: 5, ease: Back.easeOut }) }
My problem is that when I call myFunction myOtherFunction is called at the same time. It doesn't wait for myFunction to finish and then calls myOtherFunction. Perhaps I need a callback but I'm not sure where.
How to ensure the call() function adds length to your timeline
in GSAP
Posted
Well shoot, that was easy. Thanks Diaco!
Add on question: will this account for nested onComplete functions within the function called?
For example, the function called tweens in a circle on a map and then that has an onComplete function that populates a bunch of dots on the map. Will using add account for the onComplete function as well?