TweenMax – TweenLite on Steroids

IMPORTANT:
This page covers version 11 of TweenMax which will soon be “sunset” in favor of the new, more capable version 12. We highly recommend using v12 for all of your projects. It is very stable and has numerous improvements while being backwards compatible with most legacy code (see the v12 announcement for details). The new version also has an incredibly fast JavaScript flavor that uses an identical syntax. Don’t miss out; upgrade today.

The “Download AS3″ and “Download AS2″ links to the right get you the [older] v11 files. Click the “get GSAP” button on the left to get v12, or go to the main v12 announcement page.

Description

TweenMax extends the extremely lightweight, fast TweenLite engine, adding many useful features like timeScale, AS3 event dispatching, updateTo(), yoyo, repeat, repeatDelay, rounding, and more. It also activates many extra plugins by default, making it extremely full-featured. Since TweenMax extends TweenLite, it can do anything TweenLite can do plus much more. The syntax is identical. With plenty of other tweening engines to choose from, here’s why you might want to consider TweenMax:

  • SPEED - TweenMax has been highly optimized for maximum performance. See some speed comparisons here.
  • Feature set - In addition to tweening any numeric property of any object, TweenMax can tween filters, hex colors, volume, tint, frames, saturation, contrast, hue, colorization, brightness, and even do bezier tweening, orientToBezier, round values, jump to any point in the tween with the currentTime or currentProgress property, automatically rotate in the shortest direction, plus LOTS more. Overwrite management is an important consideration for a tweening engine as well which is another area where the GreenSock Tweening Platform shines. You have options for AUTO overwriting or you can manually define how each tween will handle overlapping tweens of the same object.
  • Expandability - With its plugin architecture, you can activate as many (or as few) features as your project requires. Write your own plugin to handle particular special properties in custom ways. Minimize bloat, and maximize performance.
  • Sequencing, grouping, and management features - TimelineLite and TimelineMax make it surprisingly simple to create complex sequences or groups of tweens that you can control as a whole. play(), pause(), restart(), or reverse(). You can even tween a timeline’s currentTime or currentProgress property to fastforward or rewind the entire timeline. Add labels, gotoAndPlay(), change the timeline’s timeScale, nest timelines within timelines, and lots more.
  • Ease of use - Designers and Developers alike rave about how intuitive the platform is.
  • Support - Not only is the platform actively updated, but there are dedicated forums for getting your questions answered at http://forums.greensock.com. When you’re up against a deadline and run across some odd behavior, this can be a life saver. Using a stale open source alternative with limited or no active support can be costly indeed for your business.
  • AS2 and AS3 - Most other engines are only developed for AS2 or AS3 but not both.

Getting started

If you’re new to the GreenSock Tweening Platform, check out the “getting started” page. You’ll be up and running in no time.

Documentation

Please view full v11 ASDoc documentation here. For your convenience, the special properties are listed below as well, but to read up on all the methods and properties, definitely check the ASDocs.

Interactive demo – tweening basics

Special properties

You can pass any of the following special properties in through the constructor’s “vars” parameter like new TweenMax(mc, 1, {x:100, delay:1.5, paused:true, onComplete:myFunction}) to control various aspects of the tween (or use a TweenMaxVars object):

  • delay : Number – Number of seconds (or frames if useFrames is true) that should elapse before the tween begins.
  • paused : Boolean – Sets the initial paused state of the timeline (by default, tweens automatically begin playing)
  • useFrames : Boolean – If useFrames is set to true, the tween’s timing mode will be based on frames. Otherwise, it will be based on seconds/time. NOTE: a tween’s timing mode is always determined by its parent timeline.
  • ease : FunctionUse any standard easing equation to control the rate of change. For example, Elastic.easeOut. The Default is Quad.easeOut.
  • easeParams : Array An Array of extra parameters to feed the easing equation (beyond the standard first 4). This can be useful when using an ease like Elastic and want to control extra parameters like the amplitude and period. Most easing equations, however, don’t require extra parameters so you won’t need to pass in any easeParams.
  • reversed : Boolean – If true, the tween will be reversed initially. This does not swap the starting/ending values in the tween – it literally changes its orientation/direction. Imagine the playhead moving backwards instead of forwards. This does NOT force it to the very end and start playing backwards. It simply affects the orientation of the tween, so if reversed is set to true initially, it will appear not to begin because it is already at the beginning. To cause it to play backwards from the end, set reversed to true and then set the currentProgress property to 1 immediately after creating the tween (or set the currentTime to the duration).
  • immediateRender : Boolean Normally when you create a tween, it begins rendering on the very next frame (when the Flash Player dispatches an ENTER_FRAME event) unless you specify a delay. This allows you to insert tweens into timelines and perform other actions that may affect its timing. However, if you prefer to force the tween to render immediately when it is created, set immediateRender to true. Or to prevent a tween with a duration of zero from rendering immediately, set this to false.
  • overwrite : int Controls how (and if) other tweens of the same target are overwritten by this tween. There are several modes to choose from, and TweenMax automatically calls OverwriteManager.init() if you haven’t already manually dones so, which means that by default AUTO mode is used (please see http://www.greensock.com/overwritemanager/ for details and a full explanation of the various modes):
    • NONE (0) (or false)
    • ALL_IMMEDIATE (1) (or true)
    • AUTO (2) – this is the default mode for TweenMax.
    • CONCURRENT (3)
    • ALL_ONSTART (4)
    • PREEXISTING (5)

    Example: TweenMax.to(mc, 1, {x:100, overwrite:5});

  • repeat : int – Number of times that the tween should repeat. To repeat indefinitely, use -1.
  • repeatDelay : Number – Amount of time in seconds (or frames for frames-based tweens) between repeats.
  • yoyo : Boolean – Works in conjunction with the repeat property, determining the behavior of each cycle. When yoyo is true, the tween will go back and forth, appearing to reverse every other cycle (this has no affect on the “reversed” property though). So if repeat is 2 and yoyo is false, it will look like: start – 1 – 2 – 3 – 1 – 2 – 3 – 1 – 2 – 3 – end. But if repeat is 2 and yoyo is true, it will look like: start – 1 – 2 – 3 – 3 – 2 – 1 – 1 – 2 – 3 – end.
  • startAt : Object Allows you to define the starting values for each property. Typically, TweenMax uses the current value (whatever it happens to be at the time the tween begins) as the start value, but startAt allows you to override that behavior. Simply pass an object in with whatever properties you’d like to set just before the tween begins. For example, if mc.x is currently 100, and you’d like to tween it from 0 to 500, do TweenMax.to(mc, 2, {x:500, startAt:{x:0}});
  • onInit : Function – A function that should be called just before the tween inits (renders for the first time). Since onInit runs before the start/end values are recorded internally, it is a good place to run code that affects the target’s initial position or other tween-related properties. onStart, by contrast, runs AFTER the tween inits and the start/end values are recorded internally. onStart is called every time the tween begins which can happen more than once if the tween is restarted multiple times.
  • onInitParams : Array – An Array of parameters to pass the onInit function.
  • onStart : Function – A function that should be called when the tween begins (when its currentTime is at 0 and changes to some other value which can happen more than once if the tween is restarted multiple times).
  • onStartParams : Array – An Array of parameters to pass the onStart function.
  • onUpdate : Function A function that should be called every time the tween’s time/position is updated (on every frame while the tween is active)
  • onUpdateParams : Array – An Array of parameters to pass the onUpdate function
  • onRepeat : Function – A function that should be called every time the tween repeats
  • onRepeatParams : Array – An Array of parameters to pass the onRepeat function
  • onComplete : Function – A function that should be called when the tween has completed. To sense when a tween has reached its starting point again after having been reversed, use onReverseComplete.
  • onCompleteParams : Array – An Array of parameters to pass the onComplete function
  • onReverseComplete : Function – A function that should be called when the tween has reached its starting point again after having been reversed
  • onReverseCompleteParams : Array – An Array of parameters to pass the onReverseComplete function
  • onStartListener : Function – A function to which the TweenMax instance should dispatch a TweenEvent when it begins. This is the same as doing myTween.addEventListener(TweenEvent.START, myFunction);
  • onUpdateListener : Function – A function to which the TweenMax instance should dispatch a TweenEvent every time it updates values. This is the same as doing myTween.addEventListener(TweenEvent.UPDATE, myFunction);
  • onCompleteListener : Function – A function to which the TweenMax instance should dispatch a TweenEvent when it completes. This is the same as doing myTween.addEventListener(TweenEvent.COMPLETE, myFunction);
  • onReverseCompleteListener : Function A function to which the TweenMax instance should dispatch a TweenEvent when it completes in the reverse direction. This is the same as doing myTween.addEventListener(TweenEvent.REVERSE_COMPLETE, myFunction);
  • onRepeatListener : Function A function to which the TweenMax instance should dispatch a TweenEvent when it repeats. This is the same as doing myTween.addEventListener(TweenEvent.REPEAT, myFunction);

Plugins

Plugins allow you to expand the capabilities of TweenLite/Max by handling specific properties in unique ways. Each plugin is associated with a special property name and it takes responsibility for handling that property. For example, the FrameLabelPlugin is associated with the “frameLabel” special property so if it is activated it will intercept the “frameLabel” property in the following tween and manage it uniquely:

TweenMax.to(mc, 1, {frameLabel:"myLabel"});

If the FrameLabelPlugin wasn’t activated, TweenMax would act as though you were trying to literally tween the mc.frameLabel property (and there is no such thing).

Activating a plugin requires a single line of code and you only need to do it ONCE in your application, so it’s pretty easy. Simply pass an Array containing the names of all the plugins you’d like to activate to the TweenPlugin.activate() method, like this:

TweenPlugin.activate([FrameLabelPlugin, ColorTransformPlugin]);

To make it even easier, I created the Plugin Explorer which writes the code for you. All you need to do is select the plugins and copy/paste the code from the bottom of the tool. It also shows interactive examples of each plugin and the assocaited code so that it’s easy to see the correct syntax.

TweenMax automatically activates many plugins by default, but you can change which plugins it activates by opening the class file and commenting or uncommenting the necessary lines towards the top of the class (clearly labeled).

Sample code

NOTE: All sample code is in AS3, but the AS2 version works exactly the same except the property names may be different, like “_x” instead of “x”, “_alpha” instead of “alpha”, etc. And in AS3, alpha/scaleX/scaleY go from 0-1 whereas in AS2, _alpha/_xscale/_yscale go from 0-100. This has nothing to do with TweenLite/Max – it’s just a change Adobe made in the AS3 language.

//import the GreenSock classes
import com.greensock.*;
import com.greensock.easing.*;

//tween the MovieClip named "mc" to an alpha of 0.5 over the course of 3 seconds
TweenMax.to(mc, 3, {alpha:0.5});

//scale myButton to 150% (scaleX/scaleY of 1.5) using the Elastic.easeOut ease for 2 seconds
TweenMax.to(myButton, 2, {scaleX:1.5, scaleY:1.5, ease:Elastic.easeOut});

//tween mc3 in FROM 100 pixels above wherever it is now, and an alpha of 0. (notice the vars object defines the starting values instead of the ending values)
TweenMax.from(mc3, 1, {y:"-100", alpha:0});

//tween mc4 from x:100 to x:300 while changing its tint from whatever it is when the tween starts to red (0xFF0000)
TweenMax.fromTo(mc4, 1, {x:100}, {x:300, tint:0xFF0000});

//after a delay of 3 seconds, tween mc for 5 seconds, sliding it across the screen by changing its "x" property to 300, using the Back.easeOut ease to make it shoot past it and come back, and then call the onFinishTween() function, passing two parameters: 5 and mc
TweenMax.to(mc, 5, {delay:3, x:300, ease:Back.easeOut, onComplete:onFinishTween, onCompleteParams:[5, mc]});
function onFinishTween(param1:Number, param2:MovieClip):void {
    trace("The tween has finished! param1 = " + param1 + ", and param2 = " + param2);
}

//call myFunction() after 2 seconds, passing 1 parameter: "myParam"
TweenMax.delayedCall(2, myFunction, ["myParam"]);

//tween every MovieClip in the "letters" Array up 100 pixels (changing their "y" property to a relative value of "-100") over 2 seconds while fading out, and stagger the start time of each tween by 0.1 seconds. There could literally be hundreds of MovieClips in the "letters" Array and this one line of code would tween them all!
TweenMax.allTo(letters, 2, {y:"-100", alpha:0}, 0.1);

//use the object-oriented syntax to create a TweenMax instance and store it so we can reverse, restart, or pause it later. Make it repeat twice with a 1-second delay between each repeat cycle.
var myTween:TweenMax = new TweenMax(mc2, 3, {y:200, repeat:2, repeatDelay:1, onComplete:myFunction});

//some time later (maybe in by a ROLL_OUT event handler for a button), reverse the tween, causing it to go backwards to its beginning from wherever it is now.
myTween.reverse();

//pause the tween
myTween.pause();

//restart the tween
myTween.restart();

//make the tween jump to its halfway point
myTween.currentProgress = 0.5;

FAQ

  1. Is the new version of TweenMax backwards compatible with v10?
    The short answer is “yes, mostly“, but I’d strongly encourage you to check out the official announcement page for details because a few things have changed.
  2. I don’t want to use v11 – can I get a legacy copy of v10?
    Sure. But I do not plan to update previous versions. v10 was very stable and you can get it here: Download AS2 | Download AS3
  3. How do I activate extra plugins?
    Check out the Plugin Explorer above. Not only does it provide interactive examples of each plugin, but it also writes the activation code for you and shows how many kb the plugins will cost.
  4. How do I install the class? Do I have to import it on every frame?
    Please refer to the “getting started” page.
  5. Can I set up a sequence of tweens so that they occur one after the other?
    Of course! That’s precisely what TimelineLite and TimelineMax are for. But if file size is a big concern and you don’t need all the fancy extras those tools offer, you could just use the delay property in TweenMax. Here’s an example where we tint a MovieClip red over the course of 2 seconds, and then move it to a y coordinate of 300 over the course of 1 second:

    import com.greensock.TweenMax;
    TweenMax.to(mc, 2, {tint:0xFF0000});
    TweenMax.to(mc, 1, {y:300, delay:2});
  6. Do the properties have to be in a specific order?
    Nope. So TweenMax.to(mc, 1, {x:100, y:200, alpha:0.5}) is the same as TweenMax.to(mc, 1, {alpha:0.5, y:200, x:100});
  7. Is there a way I can get code hinting and strict datatyping in the vars object I pass to TweenLite/TweenMax?
    Sure, the TweenMaxVars class does exactly that.
  8. Do I have to purchase a license to use this code? Can I use it for commercial purposes?
    You may use the code at no charge in commercial or non-commercial web sites, games, components, applications, and other software as long as end users are not charged a fee of any kind to use your product or gain access to it. If your client pays you a one-time fee to create the site/product, that’s perfectly fine and qualifies under the “no charge” license. If multiple end users are charged a usage/access/license fee of any kind, please simply sign up for a corporate Club GreenSock membership which comes with a special commercial license granting you permission to do so. See http://www.greensock.com/club/ for details. Club GreenSock members get several nifty bonus plugins, classes, update notifications, SVN access, and more. Your donations keep this project going. Please see the licensing page for details on licensing.

Need help?

Feel free to post your question on the forums. You’ll increase your chances of getting a prompt answer if you provide a brief explanation and include a simplified FLA file (and any class files) that clearly demonstrates the problem.

Author: Jack Doyle
Copyright 2013, GreenSock (This work is subject to the terms here.)

  • Twitter
  • Facebook
  • Digg
  • StumbleUpon
  • del.icio.us
  • Yahoo! Buzz
  • Google Bookmarks
  • RSS
  • LinkedIn
  • Reddit

Comments (97) RSS

Posted by Durss on April 6, 2008

Thank you sooooooooo much!!!
That is simply “perfect” ;)

Posted by llops on April 6, 2008

I’m glad with this release! Thank you very much Jack! :)

pd: bezierThrough is pretty cool, great idea (I never like the bezier system)

Posted by Tony on April 8, 2008

Thanks! These classes are awesome! They have become an invaluable part of my AS3 coding arsenal . . . finding uses in almost every project on which I’m working. I made a donation today to support your work and encourage others to do the same.

Posted by Todd on April 8, 2008

Nice job Jack! Very impressive!

Posted by AmerSoft on April 8, 2008

Unbelievable , great , beautiful work !!
Thank you Jack !! it is what we were waiting for !!

Posted by Mike on April 8, 2008

Absolutely brilliant, Jack.
Much thanks =)

Posted by ashim on April 8, 2008

Absolutely incredible. Thank you so much for all your releases. TweenLite especially has been magical, even in 3D.

Posted by trypt on April 8, 2008

i don’t know what to say…
this is just too good to be true.
thank u so much, jack!

Posted by Min Thu on April 8, 2008

This is really great. I really like the feature of tweening through beizer points.

Posted by anoxamoon on April 9, 2008

Man…. you are THE MAN!

I love your work and as always… its very impressive…. I’ve been tweening with tweenlite like crazy…. but now… its MAX-crazy time!

keep up the great work…

by the way… I love combining your tween engine with my new hobby (Papervision3d)… they work awsome together.

Posted by anoxamoon on April 9, 2008

Awsome! I was fiddling around, and guess what… bezier tweening is not just for position objects! you can bezier tween anything.

Posted by chris mca on April 11, 2008

I agree with everyone else. TweenMax is the absolute greatest – now that it consolidates the other 2 engines, and still VERY small size. As a designer / flash developer, i highly recommend this to everyone! Thank you for all of your hard work. Keep it up!

Posted by Marco on April 18, 2008

I’d like to praise you for THE greateste piece of programming I’ve seen in ActionScript… Small, fast, reliable… What else? ;)

Posted by Ozzy Benn on April 24, 2008

Again, you rock brother — TweenMax is a God send and just in the nick-o-time especially with the BezierTo and OrientToBezier funcs — fantastic, I’m already use this on Pro Projects right now — and yes I will donate as soon as I can paid from the client :) You deserve it, seriously.

ROCK ON! Ozzy

Posted by Misenensis on May 5, 2008

Very amazing tweening engine. I replaced it with the Adobe tween class in my current project, and well.. Tweens where smooth again :). I’m going to develop futher with it, hoping to find the perfect tween engine in this.

Keep on the good work!

Posted by Scott Gibson on May 14, 2008

Once again, you’ve made my life easier like you wouldn’t believe.

However, I’m holding out sending my firstborn child to you until I see this:

TweenUltraSuperMax3.buildWebsite(this, 0, {buttons, content, copy, onComplete:PayMe});

Thanks a ton!

Posted by Nuu on May 23, 2008

I am speechless… I would like to just drop a line to commend you on a fantastic piece of code. Small fast and awesome …

Speechless and grinning like mad is all I have to say.

Posted by Simon on May 27, 2008

Bravo mister Doyle! TweenMax is THE most important package in my business’ framework!

Posted by Garlon on June 24, 2008

Dude….
This is simply…

THE SHIZLNIT!!!! Wow your programming ingenuity is amazing!

Posted by andrew on July 2, 2008

Garlon sums up my thoughts exactly!

Posted by Jan on July 4, 2008

Thanks, really! The most useful piece AS3 programming of em all!

Posted by samedi on July 20, 2008

you are my Hero!!!! You just saved me at least a week of struggling…

Posted by designdrumm on August 2, 2008

People like you truly make the world go forward, not just around.
Thank you for your generosity

Posted by Kevin on August 3, 2008

Wow. I mean, wow.
Nothing else compares – and I’m taking that out of the API scope; I mean MP3 players, baklava, and new girlfriends.

You’ve taken all the fun out of life…and that’s okay.

Posted by chris mcandrew on August 15, 2008

Just wanted to say thanks as well. Your willingness to share what you have put very hard work into is appreciated. Your Tween engines are by far the best I’ve come across. Keep up the great work and thanks again!

Posted by RJ Forbes on August 17, 2008

Hooray for yoyo! Thanks again for the constant barrage of updates to this excellent class.

Posted by Sam Wilson on August 20, 2008

Great work, I just got done banging my head against HydroTween and for me this was much easier to get what I needed to do done.

Posted by Asimov on September 6, 2008

Thanks for TweenMax, you are an Actionscript hero!

Posted by Nikita on September 11, 2008

Great work! I’ve been looking for something exactly like this for a long time. bezierThrough – it’s realy something. TweenMax.globalTimeScale – very interesting. Thanks a lot!

Posted by John Webber on September 29, 2008

I’ve been making some great strides using Papervision3D with TweenMax. It is able to do all our tweening for Cameras & Objects and also Groups of Object using DisplayObject3D.

//create a new DisplayObject3D at the top
private var bigContainer:DisplayObject3D = new DisplayObject3D();

//add the bigContainer to the scene
default_scene.addChild(bigContainer);

//add some items to the DisplayObject3D
bigContainer.addChild(MOVIECLIP);

//spin it!
TweenMax.to(bigContainer, 10, {rotationY:360,loop:true,ease:Regular.easeInOut});

Tween a Scene within a Scene!

Posted by Claus Due on October 1, 2008

Fantastic work. This works so much better than the built-in tween handlers – and creating sweet effects is just a breeze.

I’m so happy I found you, GreenSock and Jack :)

Posted by Joris on October 7, 2008

Amazing work! I can’t imagine doing anything without your classes anymore…

Posted by LL on October 14, 2008

WOW – roundProps! Another wonderful feature, this is awesome! Die half pixels, die ;-) Go go roundProps! Tweens away!

Posted by arne on October 19, 2008

this tool is PERFECT!
bravo and thank you VERY much!

little details like “autoAlpha” are so cool

Posted by Xan on October 26, 2008

A WEEK OF BANGING MY HEAD ON A DESK solved in 1 friggin day of work

and THANK YOU!

PS: Will be donating 4 sure

Posted by Bastian on November 17, 2008

shortRotation is exactly that feature I have missed two weeks ago and I have been so frustrated because I needed about half the day to get the result I needed…

Posted by Scott Lee on November 21, 2008

Thanks very much. Saved me from having to solve an issue with tweens not finishing because TweenMax works just as expected! Dropped it in and the problems went away. :)

Posted by AmerSoft on December 16, 2008

You think you know, but you have no idea what you did to my work style with your amazing TweenMax class, and how happy and satisfied I am with your meritorious work – your classes become the base of all of my projects, I use it every ware instead of the timeline, all of the methods are very useful especially the from() and allFrom(), not only this, it is also available for both AS3 and AS2 which mean my current and old projects still supported with the latest updates..
I feel I have to donate, please accept a BIG Thank you from me.

Posted by Vanilla on January 25, 2009

OMG. This class is AMAZING. You really deserve my donation. Don’t know if it’s fair enough but I really have to.
Thanks!

Posted by Mike on March 12, 2009

Jack, thank you. I’m a noobie to flash and tweening was a dark art until you shone a bright light on it. Now, with your help, it’s so simple. I’m as chuffed as a squirrel in a hazelnut tree.

And…You ‘play fair’ with your donation-ware approach. Deep love and respect.

Posted by Ian on March 17, 2009

THANK YOU! This is a great tool. You certainly deserve my donation and I’ll be donating more as I can. You’ve saved me hours of time and raised the bar on the work. Thanks again.

Posted by Julian on March 28, 2009

Now THAT is best stuff ever! Good work! This saved my ass…and coding at 290 km/h speeding through the republic – updating repositories online all the time, hearing Mozart full power is just insane :-)
Thank you very much for this awesome work!

Posted by whiteblot on April 19, 2009

Thank you so much for that excellent tweening engine. It’s amazingly fast and versatile. I switched from tweener and I’m very happy!

Posted by Bobby Berberyan on April 23, 2009

You leave other programmers to shame.. I LOVE IT WHEN IT HURTS!!!

Posted by Jaime on May 26, 2009

The fact your engine comes with Gaia Flash Framework by default means it is top dog. I’m switching ASAP.

Posted by Guy segal on June 26, 2009

No room left here for compliments :) , so here is a question : how to use reverse() WITHOUT reversing the ease ?
thanx alot
Guy

Posted by jack on June 26, 2009

Thanks Guy. To answer your question, it’s a bit of a tricky issue because a true reverse doesn’t change anything in the tween – time simply passes in the opposite direction, but what you’re asking for is more of a “flip” which could be accomplished using two sequenced tweens. Feel free to dump them into a TimelineMax if you want to control it as a group. Here are two options for creating an infinite loop like that:

new TimelineMax({tweens:[[mc, 1, {x:"100", ease:Strong.easeOut}], [mc, 1, {x:"-100", ease:Strong.easeOut}]], align:TweenAlign.SEQUENCE, repeat:-1});

-OR-

function doTween1():void {
TweenLite.to(mc, 1, {x:”100″, ease:Strong.easeOut, onComplete:doTween2});
}
function doTween2():void {
TweenLite.to(mc, 1, {x:”-100″, ease:Strong.easeOut, onComplete:doTween1});
}
doTween1();

Posted by Thomas James on August 9, 2009

Could you shed some light on how to do the following:

varStr:String = “Back.easeOut”
TweenLite.to(myScrollbar.scrollTarget, transTime, { y: -scrollPos, ease:varStr} );

I’ve written a scrollbar where I want the user to be able to pass in easing type as a string argument. However the above will not work as ease: requires a Function not a String.

Is there a way other than getDefinitionByName ? Cause if you use getDefinitionByName then it seems I also have to specify the different easing types as variables in the Class I’m writing…

Thankful for reply

Thomas

Posted by jack on August 10, 2009

Sure, Thomas, you can use the EaseLookup class to translate Strings into the easing functions. The reason I don’t build that directly into TweenLite/Max is because it forces all the easing equations to be embedded in your SWF which most people don’t need, and it eats up extra kb. Check out the documentation at the top of the EaseLookup class for usage instructions (don’t worry, it’s really easy). It’s in the easing package (gs.easing for v10, and com.greensock.easing in v11 and later).

Posted by Seth on September 28, 2009

LOVE THE CLASSES!

I can’t stress this enough. Guys (and gals) give the man some $ for his work. Imagine what your work would look like and how it would flow if you didn’t have his classes.

Great work, Jack.

Posted by Dennis Ross on September 29, 2009

Jack, you clearly have a passion for writing beautiful, feature filled code. There’s no way you’d offer the community so many great classes, while asking for so little, if you didn’t.

You’ve already saved me a lot of time on my current project.
I’m looking forward to using it with some papervision3d classes.

Let’s pay this man!! .

Thank you so much Jack!!

Posted by Tim Soret on October 22, 2009

Wonderful job with the final release of TweenMax / Tweenlite v11.
Thanks again for your dedication, you allowed me to easily enter the industry.

Posted by Roberto Cantarano on February 4, 2010

Great Jack!
It’s always a pleasure to be a member of the Club GreenSock! Your AS3 classes work perfectly ;)

Good Job!!!

Posted by Justin on February 24, 2010

I’ve been working with some large bitmaps for a screen saver. Things were getting sluggish moving around those big bitmaps, and I noticed the problem was increasing with the more files I added.

autoAlpha just increase my performance huge! I did not realize that when alpha was set just to zero that Flash was still rendering the graphics. (I guess that makes sense if you still want to capture mouse events, but pretty useless for this application).

This and changing my frame rate to 60, really helped smooth out those large bitmaps!

Thanks again!

Justin

Posted by Rob on March 23, 2010

I’m amazed by the GreenSock engine. It makes tweening fun and intuitive (the way it should be), while seriously increasing my productivity. I’m not the kind of person who normally donates money or buys software libraries, but this is just too good and helpful not to be rewarded.

I’m happy to be a “Shockingly Green” member!

Posted by Noel on May 19, 2010

I love GreenSock! thank you for making flash development faster, easier, and more fun :)

Posted by Kevin on June 19, 2010

Wow! GreenSock’s tween max is an amazing tool :) and really help full for action script developers.

Thanks

Posted by Erik P. Hansen on June 25, 2010

TweenMax.globalTimeScale = greatest thing ever! Thank you!

Posted by Mark A. on July 27, 2010

Simple and amazingly easy to use. Proud to be Greensock member :)

Posted by Awesome Awesome Awesome on August 11, 2010

Thanks for this, really appreciated.

Posted by iguoguo on August 14, 2010

TweenMax is a very good Tweener framework,I work with it every day.
Thank you every much.

Posted by Roman Sørensen on August 24, 2010

Thank you very much for sharing this framework! It really speeds up my actionscript life :)

Posted by Girish on October 1, 2010

I don’t think I will be able to work in Flash without GreenSock TweenMax or TimelineMax.

Posted by Rozen on October 14, 2010

This is COOL as hell. I WILL feel bad if I don’t donate! :-)

Posted by Alex on October 27, 2010

You are the man, you have made my work so much easier. keep up the good work.

Posted by Free Flash Animations on November 11, 2010

You did great job.. really awesome…

thanx

Posted by Vinay Raj on November 12, 2010

Thank you. Jack.. Tweening in As3 is so easy now. You are THE MAN

Posted by haile on November 24, 2010

thank you jack you are great!

Posted by acetweener on December 3, 2010

very nice work.

Posted by jorge on January 21, 2011

Man..this class is AWESOME!!!!
i’m just making my first steps into as3 and Greensock is so damn crazy!!
LOVE IT!!!!

Posted by K-WORK on January 21, 2011

I see you’ve got Adobe in the showcase now, that’s a good look.

Posted by Simon on February 1, 2011

I use this in every flash project I do. Simply the best!

Posted by M-A Lavoie on February 10, 2011

Hi… does the class include the shortRotation feature but for 3D ?

ie: shortRotationX, shortRotationY, shortRotationZ

thanks!

Posted by Jack on February 10, 2011

Absolutely, M-A – the shortRotation feature accommodates any rotation property, even multiple ones at the same time, so you could do this:

TweenMax.to(mc, 1, {shortRotation:{rotationX:75, rotationY:-15, rotationZ:150}});

(assuming you’re publishing to Flash Player 10 or later of course)

Posted by nedal on February 26, 2011

which versions of flash i can use this timelinemax…

forexample.. flashMX and flash CS4 …

REGARDS
NEDAL

Posted by Jack on February 27, 2011

nedal, you can use the tweening classes with almost any version of Flash. There are AS2 and AS3 flavors, so you should be able to publish to Flash Player 6 and later (8 and later for filter effects)

Posted by Mark Kirstein on March 16, 2011

Dear Jack,

we joined the club greensock in 2010. We are using the classes in nearly all flash widgets. You did great work! TweenMax will save developers lots of time! We are proud to be a club member.

Thanks

Mark

Posted by TS on April 9, 2011

MEGA!!! very good job!

I’m your big fan.

Posted by Rick Kaptein on June 4, 2011

This is really the best class I’ve ever used !

thanks a lot

Posted by Steven on July 7, 2011

Dude, seriously! THANK YOU!
Best $99 I ever spent!!!

Posted by rmevision on July 21, 2011

wow…great work…..thank you!

Posted by gern on August 4, 2011

I can’t sing your praises enough. This is superb!

Posted by Ariel on August 15, 2011

Excellent!! thank you so much!!!

Posted by Denny on August 30, 2011

Hi,
is it meant that there is differenced between 180 degr ?
How can I fix that?

e.g. try the example above with with rotation:45 and rotation:225
anf hit the button “Tween” some times.
45 -> 1 rotation and than stop
225 -> always rotating 360 degr

nevertheless NICE work guy :-)

Posted by Jack on August 30, 2011

Denny, that actually has nothing to do with TweenMax – it’s just that Flash ALWAYS reports rotation values between -180 and 180. So let’s say you start at rotation:0 and you rotate to 225. That’s a total of 225 degrees that it changes during the tween. Now when that tween is done, TweenMax did in fact set rotation to 225 BUT Flash will report the rotation value as -135! You can reproduce this without TweenMax, like:

mc.rotation = 225;
trace(mc.rotation); //reports “-135″!

TweenMax.to() always tweens from the current value to the destination value (of course). So if you tween mc again to 225, TweenMax will say “okay, what’s the current value?” and it will get back -135. So that tween will go from -135 to 225 which is 360 degrees!

You can use the shortRotation plugin so that TweenMax always plots the SHORTEST direction to the new rotation value. That way, in your scenario it would stay still on the 2nd tween. See the Plugin Explorer for an interactive example.

Posted by Denny on August 30, 2011

Hi Jack,

Thanks a bunch for the advice, I did it now this way:

import com.greensock.*;
import com.greensock.plugins.*;

TweenPlugin.activate([ShortRotationPlugin]);
TweenMax.to(mc, 1, {shortRotation:{rotation:210}});

Posted by dude on September 27, 2011

wow, so amazingly fantastic!

Posted by Arun on October 19, 2011

this tool is awesome

no words, only goosebumps

Posted by Llyralei on December 6, 2011

I pretty much did my entire senior project with TweenMax. You guys saved my life. Thank you so much for this!

Posted by Abhay on May 10, 2012

Awesome ! You rock man !

Posted by claude on July 15, 2012

Hi All

Really awesome! Good jobs!

However I do not understand why some tweens seem have no effects as soon as the rendering mode is set to GPU.
colorMatrixFilter works only with CPU rendening.

Why?

Posted by Jack on July 15, 2012

claude, the CPU vs. GPU rendering thing has absolutely nothing to do with the tweening engine or its code specifically – it’s just that Adobe opted not to support ColorMatrixFilters (and probably some other filters) when in GPU mode. Frustrating, I know. Maybe they’ll fix that in future versions.

Posted by claude on July 15, 2012

Jack,
Thanks for your prompt answer. That does not matter. I have found a work around to get something quite similar. Hoping that Adobe will soon add such features. That was already a big disappointment when Idiscovered that armv6 is not supported at all by Air. But that is another story which is also nothing to do with your excellent tweening engine.

Posted by kromek on July 22, 2012

You can’t imagine how much I love all the features.
Just started to really take advantage of all the functions by reading documentation and trying examples, managed to cut my code in half by all the great parameters, and everything is sooo smoooooth. Love LOVE LOVE

Posted by jas on January 10, 2013

How to move a movie clip along a specified path/curve?

Posted by Jack on January 14, 2013

jas, BezierPlugin is exactly what you’re looking for. Check it out in the Plugin Explorer (click the “EXAMPLE” button next to “bezier” in the list).

Posted by Mohamad on February 16, 2014

There is no word to describe this as it deserves, Absolutely mesmerizing.

To download the code, you must agree to the following license:

"NO CHARGE" NON-EXCLUSIVE SOFTWARE LICENSE AGREEMENT
-----------------------------------------------------------------------------
PLAIN ENGLISH SUMMARY:

  1. You may use the code at no charge in commercial or non-commercial apps, web sites, games, components, and other software as long as end users are not charged a fee of any kind to use your product or gain access to any part of it. If your client pays you a one-time fee to create the site/product, that's perfectly fine and qualifies under the "no charge" license. If end users are charged a usage/access/license fee, please sign up for a "Business Green" Club GreenSock membership which comes with a comprehensive commercial license. See http://www.greensock.com/club/ for details.
  2. Use at your own risk. No warranties are offered.
  3. Please respect the copyright.

-----------------------------------------------------------------------------

LEGALESE:

This is a legal agreement between you (either an individual or a single entity) and GreenSock, Inc. ("GREENSOCK") for the proprietary GreenSock code known as TweenLite, TweenMax, TweenNano, TimelineLite, TimelineMax, and other copyrighted code that is available for download at http://www.greensock.com (this code and documentation, as well as any updates which may at GREENSOCK's sole discretion be provided to you from time to time, are referred to in this Agreement as "PROGRAM"). By downloading, copying, or otherwise using the PROGRAM, you agree to the terms and conditions of this Agreement. If you do not agree to the terms and conditions of this Agreement, please do not download or use the PROGRAM.

I. LICENSE
A. Subject to the terms and conditions of this Agreement, GREENSOCK hereby grants you a non-exclusive, worldwide, non-transferable right to use the PROGRAM in apps, web sites, games, components and other software applications ("Developed Works") for which the end user is NOT charged any fees. If you would like to use the code in a commercially licensed Developed Work for which end users are charged a fee (either for usage or access), simply sign up for the appropriate "Business Green" Club GreenSock membership at http://www.greensock.com/club/.

II. LIMITATION OF LICENSE AND RESTRICTIONS
A. You agree that you will not sell, rent, or license the PROGRAM's source code or any derivative works thereof to any third party without the prior written consent of GREENSOCK. Distribution of the PROGRAM as part of your Developed Work is acceptable so long as it is used exclusively as a part of your Developed Work. You agree not to modify or delete GREENSOCK'S existing copyright notices located in the source code.

B. You may use, duplicate, and distribute the compiled object code as embedded in Developed Works created by you, either for your own use or for distribution to a third party so long as end users of the Developed Work are not charged a fee for usage of or access to any portion of the Developed Work. Please see http://www.greensock.com/licensing/ for descriptions of Developed Works that qualify for the "No Charge" license.

C. You may make modifications to the source code exclusively for your own use in order to perform bug fixes or other minor edits required to operate the PROGRAM as originally intended.

III. CONSIDERATION
A. The license rights granted to you under this Agreement are at no charge, but only in the following circumstances: If on your own behalf or on behalf of a third party you incorporate the PROGRAM into a web site, app, game, program or any component thereof (collectively, "Developed Work"), which in the case of a web site, must be accessible to internet users without payment of a fee of any kind, and in the case of a software application, game, program or component, neither you nor anyone to whom you distribute the Developed Work charges a user a fee of any kind to use such Developed Work or application, game, program or component into which such Developed Work is embedded. The foregoing shall apply regardless of whether you are paid to create such Developed Work.

B. In the event your intended use of the PROGRAM does not meet the criteria for the "no charge" license rights set forth in the immediately preceding paragraph, then you are not licensed to use the PROGRAM under this Agreement and must license the PROGRAM under GREENSOCK'S separate fee-based Software License Agreement which is granted to "Business Green" Club GreenSock members (see http://www.greensock.com/club/ for details).

C. You may make modifications to the source code exclusively for your own use in order to perform bug fixes or other minor edits required to operate the PROGRAM as originally intended.

IV. TITLE AND OWNERSHIP
A. The PROGRAM is licensed, not sold, and is protected by copyright laws and international treaty provisions. You acknowledge that no title to the intellectual property in the PROGRAM is transferred to you. You further acknowledge that title and full ownership rights to the PROGRAM, including all intellectual property rights therein, will remain the exclusive property of GREENSOCK and you will not acquire any rights to the PROGRAM except as expressly set forth in this Agreement. You agree that any copies of the PROGRAM you make will contain the same proprietary notices which appear on and in the PROGRAM. You agree that GREENSOCK may identify you as a licensee unless you make a written request otherwise. GREENSOCK hereby grants to you the right to disclose that your product, game, software application, component, or other Developed Work makes use of GREENSOCK code (for example, "Powered by TweenLite").

V. DISCLAIMER OF WARRANTY AND LIMITATION OF LIABILITY
A. THE PROGRAM IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. GREENSOCK DOES NOT WARRANT THAT THE FUNCTIONS CONTAINED IN THE PROGRAM WILL MEET YOUR REQUIREMENTS OR THAT OPERATION WILL BE UNINTERRUPTED OR ERROR FREE. GREENSOCK shall not be liable for special, indirect, incidental, or consequential damages with respect to any claim on account of or arising from this Agreement or use of the PROGRAM, even if GREENSOCK has been or is hereafter advised of the possibility of such damages. Because some states do not allow certain exclusions or limitations on implied warranties or of liability for consequential or incidental damages, the above exclusions may not apply to you. In no event, however, will GREENSOCK be liable to you, under any theory of recovery, in an amount in excess of $250. Notwithstanding anything else in this agreement, you agree to indemnify GREENSOCK, its assignees, and licensees, and hold each of them harmless from and against any and all claims, losses, damages, and expenses, including legal fees arising out of or resulting from any negligent act or omission by you.

B. GREENSOCK may, at its sole discretion, provide support services related to the PROGRAM, but has no obligation to do so.

VI. TERMINATION
If you at any time fail to abide by the terms of this Agreement, GREENSOCK shall have the right to immediately terminate the license granted herein and pursue any other legal or equitable remedies available.

VII. MISCELLANEOUS
A. This Agreement shall be construed in accordance with the laws of the State of Illinois. In the event of any dispute between you and GREENSOCK with respect to this Agreement, we both agree that if we cannot resolve the dispute in good faith discussion, either of us may submit the dispute for resolution to arbitration with the American Arbitration Association before a single arbitrator using the AAA Rules for Commercial Arbitration. The arbitrator's decision is final and can be enforced in any court with jurisdiction over such matters.

B. This agreement represents the complete and exclusive statement of the agreement between GREENSOCK and you and supersedes all prior agreements, proposals, representations and other communications, verbal or written, between them with respect to use of the program. This agreement may be modified only with the mutual written approval of authorized representatives of the parties.

C. The terms and conditions of this Agreement shall prevail notwithstanding any different, conflicting, or additional terms or conditions which may appear in any purchase order or other document submitted by you. You agree that such additional or inconsistent terms are deemed rejected by GREENSOCK.

D. GREENSOCK and you agree that any xerographically or electronically reproduced copy of this Agreement shall have the same legal force and effect as any copy bearing original signatures of the parties.

Copyright 2006-2013, GreenSock, Inc. Updated 2012-08-28

I'd like to learn how to get bonus plugins, update notifications, SVN access, and more.
To continue, you must agree to the following license: