GreenSock JavaScript API Docs | All Packages | All Classes | Index | Frames No Frames |
Animation

Package | com.greensock.core
Class | public class Animation
Inheritance | Animation Object
Subclasses | SimpleTimeline, TweenLite

Base class for all TweenLite, TweenMax, TimelineLite, and TimelineMax classes, providing core methods/properties/functionality, but there is no reason to create an instance of this class directly. It can be very useful, however, as a data type in AS3/AS2 for methods/properties that can contain tweens or timelines. For example, maybe you build an `animateIn()` and `animateOut()` method for many of your own custom classes, and they each return an Animation instance which could be a tween or a timeline:

    function animateIn():Animation {
        return TweenLite.to(this, 1, {scaleX:1, scaleY:1, autoAlpha:1});
    }

    function animateOut():Animation {
        var tl:TimelineLite = new TimelineLite();
        tl.to(this, 1, {scaleX:0.5, scaleY:0.5});
        tl.to(this, 0.5, {autoAlpha:0}, -0.25);
        return tl;
    }

    var anim:Animation = animateIn();

    //now we can control the animation with the common methods:
    anim.pause();
    anim.play();
    anim.reverse();

    //or somewhere else, we could build a sequence like this:
    var tl:TimelineLite = new TimelineLite();
    tl.append( animateIn() );
    tl.append( animateOut(), 3);

Copyright 2008-2012, GreenSock. All rights reserved. This work is subject to the terms in http://www.greensock.com/terms_of_use.html or for Club GreenSock members, the software agreement that was issued with the membership.

Public Properties

| Property | Defined By
--- | --- | ---
|  | data : * A place to store any data you want (initially populated with vars.data if it exists). | Animation
|  | ticker : Shape [static] The object that dispatches a "tick" event each time the engine updates, making it easy for you to add your own listener(s) to run custom logic after each update (great for game developers). | Animation
|  | timeline : SimpleTimeline [Read-only] Parent timeline. | Animation
|  | vars : Object The vars object passed into the constructor which stores configuration variables like onComplete, onUpdate, etc. | Animation

Public Methods

| Method | Defined By
--- | --- | ---
|  | Animation(duration:Number = 0, vars:Object = null) Constructor | Animation
|  | delay(value:Number):* Gets or sets the animation's initial delay which is the length of time in seconds (or frames for frames-based tweens) before the animation should begin. | Animation
|  | duration(value:Number):* Gets or sets the animation's duration, not including any repeats or repeatDelays (which are only available in TweenMax and TimelineMax). | Animation
|  | eventCallback(type:String, callback:Function = null, params:Array = null, scope:* = null):* Gets or sets an event callback like "onComplete", "onUpdate", "onStart", "onReverseComplete" or "onRepeat" (onRepeat only applies to TweenMax or TimelineMax instances) along with any parameters that should be passed to that callback. | Animation
|  | invalidate():* Clears any initialization data (like starting/ending values in tweens) which can be useful if, for example, you want to restart a tween without reverting to any previously recorded starting values. | Animation
|  | kill(vars:Object = null, target:Object = null):* Kills the animation entirely or in part depending on the parameters. | Animation
|  | pause(atTime:* = null, suppressEvents:Boolean = true):* Pauses the instance, optionally jumping to a specific time. | Animation
|  | paused(value:Boolean = false):* Gets or sets the animation's paused state which indicates whether or not the animation is currently paused. | Animation
|  | play(from:* = null, suppressEvents:Boolean = true):* Begins playing forward, optionally from a specific time (by default playback begins from wherever the playhead currently is). | Animation
|  | restart(includeDelay:Boolean = false, suppressEvents:Boolean = true):* Restarts and begins playing forward from the beginning. | Animation
|  | resume(from:* = null, suppressEvents:Boolean = true):* Resumes playing without altering direction (forward or reversed), optionally jumping to a specific time first. | Animation
|  | reverse(from:* = null, suppressEvents:Boolean = true):* Reverses playback so that all aspects of the animation are oriented backwards including, for example, a tween's ease. | Animation
|  | reversed(value:Boolean = false):* Gets or sets the animation's reversed state which indicates whether or not the animation should be played backwards. | Animation
|  | seek(time:*, suppressEvents:Boolean = true):* Jumps to a specific time without affecting whether or not the instance is paused or reversed. | Animation
|  | startTime(value:Number):* Gets or sets the time at which the animation begins on its parent timeline (after any delay that was defined). | Animation
|  | time(value:Number, suppressEvents:Boolean = false):* Gets or sets the local position of the playhead (essentially the current time), described in seconds (or frames for frames-based animations) which will never be less than 0 or greater than the animation's duration. | Animation
|  | timeScale(value:Number):* Factor that's used to scale time in the animation where 1 = normal speed (the default), 0.5 = half speed, 2 = double speed, etc. | Animation
|  | totalDuration(value:Number):* Gets or sets the animation's total duration including any repeats or repeatDelays (which are only available in TweenMax and TimelineMax). | Animation
|  | totalTime(time:Number, suppressEvents:Boolean = false):* Gets or sets the position of the playhead according to the totalDuration which includes any repeats and repeatDelays (only available in TweenMax and TimelineMax). | Animation

Property Detail

data | property

`public var data:*`

A place to store any data you want (initially populated with `vars.data` if it exists).

ticker | property |

`public static var ticker:Shape`

The object that dispatches a `"tick"` event each time the engine updates, making it easy for you to add your own listener(s) to run custom logic after each update (great for game developers). Add as many listeners as you want. The basic syntax is the same for all versions (AS2, AS3, and JavaScript):

Basic example (AS2, AS3, and JavaScript):

    //add listener
    Animation.ticker.addEventListener("tick", myFunction);

    function myFunction(event) {
        //executes on every tick after the core engine updates
    }

    //to remove the listener later...
    Animation.ticker.removeEventListener("tick", myFunction);

Due to differences in the core languages (and to maximize efficiency), the advanced syntax is slightly different for the AS3 version compared to AS2 and JavaScript. The parameters beyond the first 2 in the addEventListener() method are outlined below:

JavaScript and AS2

`addEventListener(type, callback, scope, useParam, priority)`

Parameters:

1. type : String - type of listener, should always be `"tick"`
2. callback : Function - the function to call when the event occurs
3. scope : Object - binds the scope to a particular object (scope is basically what "`this`" refers to in your function). This can be very useful in JavaScript and AS2 because scope isn't generally maintained.
4. useParam : Boolean - if `true`, an event object will be generated and fed to the callback each time the event occurs. The event is a generic object and has two properties: `type` (always `"tick"`) and `target` which refers to the ticker instance. The default for `useParam` is `false` because it improves performance.
5. priority : Integer - influences the order in which the listeners are called. Listeners with lower priorities are called after ones with higher priorities.

In JavaScript, the Animation object/class is located at `com.greensock.core.Animation` - it is not added to the global namespace in order to avoid polluting it (developers rarely directly access the Animation class)

Advanced example (JavaScript and AS2):

    //add listener that requests an event object parameter, binds scope to the current scope (this), and sets priority to 1 so that it is called before any other listeners that had a priority lower than 1...
    Animation.ticker.addEventListener("tick", myFunction, this, true, 1);

    function myFunction(event) {
        //executes on every tick after the core engine updates
    }

    //to remove the listener later...
    Animation.ticker.removeEventListener("tick", myFunction);

AS3

The AS3 version uses the standard `EventDispatcher.addEventListener()` syntax which basically allows you to define a priority and whether or not to use weak references (see Adobe's docs for details).

Advanced example [AS3 only]:

    import flash.events.Event;

    //add listener with weak reference (standard syntax - notice the 5th parameter is true)
    Animation.ticker.addEventListener("tick", myFunction, false, 0, true);

    function myFunction(event:Event):void {
        //executes on every tick after the core engine updates
    }

    //to remove the listener later...
    Animation.ticker.removeEventListener("tick", myFunction);

timeline | property |

`public var timeline:SimpleTimeline`

[Read-only] Parent timeline. Every animation is placed onto a timeline (the root timeline by default) and can only have one parent. An instance cannot exist in multiple timelines at once.

vars | property |

`public var vars:Object`

The `vars` object passed into the constructor which stores configuration variables like onComplete, onUpdate, etc. as well as tweening properties like alpha, x, y or whatever.

Constructor Detail

Animation | () | Constructor

`public function Animation(duration:Number = 0, vars:Object = null)`

Constructor

Parameters

| `duration:Number` (default = `0`)`` — duration in seconds (or frames for frames-based tweens)
| `vars:Object` (default = `null`)`` — configuration variables (for example, `{x:100, y:0, alpha:0.5, onComplete:myFunction}`)

Method Detail

delay | () | method

`public function delay(value:Number):*`

Gets or sets the animation's initial delay which is the length of time in seconds (or frames for frames-based tweens) before the animation should begin. A tween's starting values are not recorded until after the delay has expired (except in `from()` tweens which render immediately by default unless `immediateRender:false` is set in the `vars` parameter). An animation's `delay` is unaffected by its `timeScale`, so if you were to change `timeScale` from 1 to 10, for example, it wouldn't cause the delay to grow tenfold.

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining, like `myAnimation.delay(2).timeScale(0.5).play(1);`

     var currentDelay = myAnimation.delay(); //gets current delay
     myAnimation.delay(2); //sets delay

Parameters

| `value:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

duration | () | method |

`public function duration(value:Number):*`

Gets or sets the animation's duration, not including any repeats or repeatDelays (which are only available in TweenMax and TimelineMax). For example, if a TweenMax instance has a `duration` of 2 and a `repeat` of 3, its `totalDuration` would be 8 (one standard play plus 3 repeats equals 4 total cycles).

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining, like `myAnimation.duration(2).delay(0.5).play(1);`

     var currentDuration = myAnimation.duration(); //gets current duration
     myAnimation.duration(2); //sets duration

Parameters

| `value:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

totalDuration()
timeScale()

eventCallback | () | method |

`public function eventCallback(type:String, callback:Function = null, params:Array = null, scope:* = null):*`

Gets or sets an event callback like `"onComplete", "onUpdate", "onStart", "onReverseComplete"` or `"onRepeat"` (`onRepeat` only applies to TweenMax or TimelineMax instances) along with any parameters that should be passed to that callback. This is the same as defining the values directly in the constructor's `vars` parameter initially, so the following two lines are functionally equivalent:

    //the following two lines produce IDENTICAL results:
    var myAnimation = new TweenLite(mc, 1, {x:100, onComplete:myFunction, onCompleteParams:["param1","param2"]});
    myAnimation.eventCallback("onComplete", myFunction, ["param1","param2"]);

The benefit of using `eventCallback()` is that it allows you to set callbacks even after the animation instance has been created and it also allows you to inspect the callback references or even delete them on-the-fly (use `null` to delete the event callback).

    //deletes the onUpdate
    myAnimation.eventCallback("onUpdate", null);

IMPORTANT:Animation instances can only have one callback associated with each event type (one `onComplete`, one `onUpdate`, one `onStart`, etc.). So setting a new value will overwrite the old one. All of the values populate the `vars` object too which was originally passed into the constructor (think of that like a storage place for configuration data).

This method serves as both a getter and setter. Omitting all but the first parameter returns the current value (getter), whereas defining more than the first parameter sets the value (setter) and returns the instance itself for easier chaining, like `myAnimation.eventCallback("onComplete", completeHandler).eventCallback("onUpdate", updateHandler, ["param1","{self}"]).play(1);`

    var currentOnComplete = myAnimation.eventCallback("onComplete"); //gets current onComplete
    myAnimation.eventCallback("onComplete", myFunction); //sets the onComplete

JavaScript and AS2 note: - Due to the way JavaScript and AS2 don't maintain scope (what "`this`" refers to, or the context) in function calls, it can be useful to define the scope specifically. Therefore, the JavaScript and AS2 versions accept a 4th parameter to [optionally] define the `scope`, but it is omitted in AS3.

Parameters

| `type:String` — The type of event callback, like `"onComplete", "onUpdate", "onStart"` or `"onRepeat"`. This is case-sensitive.
| `callback:Function` (default = `null`)`` — The function that should be called when the event occurs.
| `params:Array` (default = `null`)`` — An array of parameters to pass the callback. Use `"{self}"` to refer to the animation instance itself. Example: `["param1","{self}"]`
| `scope:*` (default = `null`)`` — The scope in which the callback should be called (basically, what "this" refers to in the function). NOTE: this parameter only pertains to the JavaScript and AS2 versions; it is omitted in AS3.

Returns

| `*` — Omitting the all but the first parameter returns the current value (getter), whereas defining more than the first parameter sets the callback (setter) and returns the instance itself for easier chaining.

invalidate | () | method |

`public function invalidate():*`

Clears any initialization data (like starting/ending values in tweens) which can be useful if, for example, you want to restart a tween without reverting to any previously recorded starting values. When you `invalidate()` an animation, it will be re-initialized the next time it renders and its `vars` object will be re-parsed. The timing of the animation (duration, startTime, delay) will not be affected.

Another example would be if you have a `TweenMax(mc, 1, {x:100, y:100})` that ran when mc.x and mc.y were initially at 0, but now mc.x and mc.y are 200 and you want them tween to 100 again, you could simply `invalidate()` the tween and `restart()` it. Without invalidating first, restarting it would cause the values jump back to 0 immediately (where they started when the tween originally began). When you invalidate a TimelineLite/TimelineMax, it automatically invalidates all of its children.

Returns

| `*` — self (makes chaining easier)

kill | () | method |

`public function kill(vars:Object = null, target:Object = null):*`

Kills the animation entirely or in part depending on the parameters. Simply calling `kill()` (omitting the parameters) will immediately stop the animation and release it for garbage collection. To kill only particular tweening properties of the animation, use the first parameter which should be a generic object with enumerable properties corresponding to those that should be killed, like `{x:true, y:true}`. The second parameter allows you to define a target (or array of targets) to affect.

Note: the values assigned to each property of the `vars` parameter object don't matter - the sole purpose of the object is for iteration over the named properties. In other words, `{x:true, y:true}` would produce the same results as `{x:false, y:false}`.

     //kill the entire animation:
     myAnimation.kill();

     //kill only the "x" and "y" properties of the animation (all targets):
     myAnimation.kill({x:true, y:true});

     //kill all parts of the animation related to the target "myObject" (if the tween has multiple targets, the others will not be affected):
     myAnimation.kill(null, myObject);

     //kill only the "x" and "y" properties of animations of the target "myObject":
     myAnimation.kill({x:true, y:true}, myObject);

     //kill only the "alpha" properties of animations of the targets "myObject1" and "myObject2":
     myAnimation.kill({alpha:true}, [myObject1, myObject2]);

Parameters

| `vars:Object` (default = `null`)`` — To kill only specific properties, use a generic object containing enumerable properties corresponding to the ones that should be killed, like `{x:true, y:true}`. The values assigned to each property of the object don't matter - the sole purpose of the object is for iteration over the named properties (in this case, `x` and `y`). If no object (or `null`) is defined, ALL properties will be killed.
| `target:Object` (default = `null`)`` — To kill only aspects of the animation related to a particular target (or targets), reference it here. For example, to kill only parts having to do with `myObject`, do `kill(null, myObject)` or to kill only parts having to do with `myObject1` and `myObject2`, do `kill(null, [myObject1, myObject2])`. If no target is defined, ALL targets will be affected.

Returns

| `*` — self (makes chaining easier)

pause | () | method |

`public function pause(atTime:* = null, suppressEvents:Boolean = true):*`

Pauses the instance, optionally jumping to a specific time.

If you define a time to jump to (the first parameter, which could also be a label for TimelineLite or TimelineMax instances), the playhead moves there immediately and if there are any events/callbacks inbetween where the playhead was and the new time, they will not be triggered because by default `suppressEvents` (the 2nd parameter) is `true`. Think of it like picking the needle up on a record player and moving it to a new position before placing it back on the record. If, however, you do not want the events/callbacks suppressed during that initial move, simply set the `suppressEvents` parameter to `false`.

     //pauses wherever the playhead currently is:
     myAnimation.pause();

     //jumps to exactly 2-seconds into the animation and then pauses:
     myAnimation.pause(2);

     //jumps to exactly 2-seconds into the animation and pauses but doesn't suppress events during the initial move:
     myAnimation.pause(2, false);

Parameters

| `atTime:*` (default = `null`)`` — The time (or label for TimelineLite/TimelineMax instances) that the instance should jump to before pausing (if none is defined, it will pause wherever the playhead is currently located).
| `suppressEvents:Boolean` (default = `true`)`` — If `true` (the default), no events or callbacks will be triggered when the playhead moves to the new position defined in the `atTime` parameter.

Returns

| `*` — self (makes chaining easier)

paused | () | method |

`public function paused(value:Boolean = false):*`

Gets or sets the animation's paused state which indicates whether or not the animation is currently paused. This does not take into account anscestor timelines. So for example, a tween that is not paused might appear paused if its parent timeline (or any ancenstor timeline) is paused. Pausing an animation doesn't remove it from its parent timeline, but it does cause it not to be factored into the parent timeline's `duration/totalDuration`. When an animation completes, it does NOT alter its paused state.

In most cases, it is easiest to use the `pause()` method to pause the animation, and `resume()` to resume it. But to check the current state, you must use the `paused()` method. It can also be useful for toggling like `myAnimation.paused( !myAnimation.paused() );`

You can set the `paused` state initially by passing `paused:true` in the `vars` parameter.

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining, like `myAnimation.paused(true).delay(2).timeScale(0.5);`

     var paused = myAnimation.paused(); //gets current paused state
     myAnimation.paused( true ); //sets paused state to true (just like pause())
     myAnimation.paused( !myAnimation.paused() ); //toggles the paused state

Parameters

| `value:Boolean` (default = `false`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

pause()
resume()
play()

play | () | method |

`public function play(from:* = null, suppressEvents:Boolean = true):*`

Begins playing forward, optionally from a specific time (by default playback begins from wherever the playhead currently is). This also ensures that the instance is neither paused nor reversed.

If you define a "from" time (the first parameter, which could also be a label for TimelineLite or TimelineMax instances), the playhead moves there immediately and if there are any events/callbacks inbetween where the playhead was and the new time, they will not be triggered because by default `suppressEvents` (the 2nd parameter) is `true`. Think of it like picking the needle up on a record player and moving it to a new position before placing it back on the record. If, however, you do not want the events/callbacks suppressed during that initial move, simply set the `suppressEvents` parameter to `false`.

    //begins playing from wherever the playhead currently is:
    myAnimation.play();

    //begins playing from exactly 2-seconds into the animation:
    myAnimation.play(2);

    //begins playing from exactly 2-seconds into the animation but doesn't suppress events during the initial move:
    myAnimation.play(2, false);

Parameters

| `from:*` (default = `null`)`` — The time (or label for TimelineLite/TimelineMax instances) from which the animation should begin playing (if none is defined, it will begin playing from wherever the playhead currently is).
| `suppressEvents:Boolean` (default = `true`)`` — If `true` (the default), no events or callbacks will be triggered when the playhead moves to the new position defined in the `from` parameter.

Returns

| `*` — self (makes chaining easier)

restart | () | method |

`public function restart(includeDelay:Boolean = false, suppressEvents:Boolean = true):*`

Restarts and begins playing forward from the beginning.

     //restarts, not including any delay that was defined
     myAnimation.restart();

     //restarts, including any delay, and doesn't suppress events during the initial move back to time:0
     myAnimation.restart(true, false);

Parameters

| `includeDelay:Boolean` (default = `false`)`` — Determines whether or not the delay (if any) is honored when restarting. For example, if a tween has a delay of 1 second, like `new TweenLite(mc, 2, {x:100, delay:1});` and then later `restart()` is called, it will begin immediately, but `restart(true)` will cause the delay to be honored so that it won't begin for another 1 second.
| `suppressEvents:Boolean` (default = `true`)`` — If `true` (the default), no events or callbacks will be triggered when the playhead moves to the new position defined in the `time` parameter.

Returns

| `*` — self (makes chaining easier)

resume | () | method |

`public function resume(from:* = null, suppressEvents:Boolean = true):*`

Resumes playing without altering direction (forward or reversed), optionally jumping to a specific time first.

If you define a time to jump to (the first parameter, which could also be a label for TimelineLite or TimelineMax instances), the playhead moves there immediately and if there are any events/callbacks inbetween where the playhead was and the new time, they will not be triggered because by default `suppressEvents` (the 2nd parameter) is `true`. Think of it like picking the needle up on a record player and moving it to a new position before placing it back on the record. If, however, you do not want the events/callbacks suppressed during that initial move, simply set the `suppressEvents` parameter to `false`.

     //resumes from wherever the playhead currently is:
     myAnimation.resume();

     //jumps to exactly 2-seconds into the animation and then resumes playback:
     myAnimation.resume(2);

     //jumps to exactly 2-seconds into the animation and resumes playbck but doesn't suppress events during the initial move:
     myAnimation.resume(2, false);

Parameters

| `from:*` (default = `null`)`` — The time (or label for TimelineLite/TimelineMax instances) that the instance should jump to before resuming playback (if none is defined, it will resume wherever the playhead is currently located).
| `suppressEvents:Boolean` (default = `true`)`` — If `true` (the default), no events or callbacks will be triggered when the playhead moves to the new position defined in the `from` parameter.

Returns

| `*` — self (makes chaining easier)

reverse | () | method |

`public function reverse(from:* = null, suppressEvents:Boolean = true):*`

Reverses playback so that all aspects of the animation are oriented backwards including, for example, a tween's ease. This will cause the instance's `time` and `totalTime` to move back towards zero as well. You can optionally define a specific time to jump to before reversing (by default it begins playing in reverse from wherever the playhead currently is). Calling `reverse()` also ensures that the instance is neither paused nor reversed.

To jump to the very end of the animation and play in reverse from there, use 0 as the "from" parameter, like `reverse(0)`.

To check whether or not the instance is reversed, use the `reversed()` method, like `if (myAnimation.reversed()) {...}`

If you define a "from" time (the first parameter, which could also be a label for TimelineLite or TimelineMax instances), the playhead moves there immediately and if there are any events/callbacks inbetween where the playhead was and the new time, they will not be triggered because by default `suppressEvents` (the 2nd parameter) is `true`. Think of it like picking the needle up on a record player and moving it to a new position before placing it back on the record. If, however, you do not want the events/callbacks suppressed during that initial move, simply set the `suppressEvents` parameter to `false`.

     //reverses playback from wherever the playhead currently is:
     myAnimation.reverse();

     //reverses playback from exactly 2 seconds into the animation:
     myAnimation.reverse(2);

     //reverses playback from exactly 2 seconds into the animation but doesn't suppress events during the initial move:
     myAnimation.reverse(2, false);

     //reverses playback from the very END of the animation:
     myAnimation.reverse(0);

     //reverses playback starting from exactly 1 second before the end of the animation:
     myAnimation.reverse(-1);

     //flips the orientation (if it's forward, it will go backward, if it is backward, it will go forward):
     if (myAnimation.reversed()) {
         myAnimation.play();
     } else {
         myAnimation.reverse();
     }

     //flips the orientation using the reversed() method instead (shorter version of the code above):
     myAnimation.reversed( !myAnimation.reversed() );

Parameters

| `from:*` (default = `null`)`` — The time (or label for TimelineLite/TimelineMax instances) from which the animation should begin playing in reverse (if none is defined, it will begin playing from wherever the playhead currently is). To begin at the very end of the animation, use `0`. Negative numbers are relative to the end of the animation, so -1 would be 1 second from the end.
| `suppressEvents:Boolean` (default = `true`)`` — If `true` (the default), no events or callbacks will be triggered when the playhead moves to the new position defined in the `from` parameter.

Returns

| `*` — self (makes chaining easier)

reversed | () | method |

`public function reversed(value:Boolean = false):*`

Gets or sets the animation's reversed state which indicates whether or not the animation should be played backwards. This value is not affected by `yoyo` repeats (TweenMax and TimelineMax only) and it does not take into account the reversed state of anscestor timelines. So for example, a tween that is not reversed might appear reversed if its parent timeline (or any ancenstor timeline) is reversed.

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

    var rev = myAnimation.reversed(); //gets current orientation
    myAnimation.reversed( true ); //sets the orientation to reversed
    myAnimation.reversed( !myAnimation.reversed() ); //toggles the orientation

Parameters

| `value:Boolean` (default = `false`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

reverse()
play()

seek | () | method |

`public function seek(time:*, suppressEvents:Boolean = true):*`

Jumps to a specific time without affecting whether or not the instance is paused or reversed.

If there are any events/callbacks inbetween where the playhead was and the new time, they will not be triggered because by default `suppressEvents` (the 2nd parameter) is `true`. Think of it like picking the needle up on a record player and moving it to a new position before placing it back on the record. If, however, you do not want the events/callbacks suppressed during that initial move, simply set the `suppressEvents` parameter to `false`.

     //jumps to exactly 2 seconds
     myAnimation.seek(2);

     //jumps to exactly 2 seconds but doesn't suppress events during the initial move:
     myAnimation.seek(2, false);

Parameters

| `time:*` — The time (or label for TimelineLite/TimelineMax instances) to go to.
| `suppressEvents:Boolean` (default = `true`)`` — If `true` (the default), no events or callbacks will be triggered when the playhead moves to the new position defined in the `time` parameter.

Returns

| `*` — self (makes chaining easier)

startTime | () | method |

`public function startTime(value:Number):*`

Gets or sets the time at which the animation begins on its parent timeline (after any `delay` that was defined). For example, if a tween starts at exactly 3 seconds into the timeline on which it is placed, the tween's `startTime` would be 3.

The `startTime` may be automatically adjusted to make the timing appear seamless if the parent timeline's `smoothChildTiming` property is `true` and a timing-dependent change is made on-the-fly, like `reverse()` is called or `timeScale()` is changed, etc. See the documentation for the `smoothChildTiming` property of timelines for more details.

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

    var start = myAnimation.startTime(); //gets current start time
    myAnimation.startTime(2); //sets the start time

Parameters

| `value:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

time | () | method |

`public function time(value:Number, suppressEvents:Boolean = false):*`

Gets or sets the local position of the playhead (essentially the current time), described in seconds (or frames for frames-based animations) which will never be less than 0 or greater than the animation's `duration`. For example, if the `duration` is 10 and you were to watch the `time` during the course of the animation, you'd see it go from 0 at the beginning to 10 at the end. Setting `time` to 5 would cause the animation to jump to its midway point (because it's half of the duration).

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

    var currentTime = myAnimation.time(); //gets current time
    myAnimation.time(2); //sets time, jumping to new value just like seek().

Parameters

| `value:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining. Negative values will be interpreted from the END of the animation.
| `suppressEvents:Boolean` (default = `false`)`` — If `true`, no events or callbacks will be triggered when the playhead moves to the new position defined in the `value` parameter.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

seek()
play()
reverse()
pause()
totalTime()

timeScale | () | method |

`public function timeScale(value:Number):*`

Factor that's used to scale time in the animation where 1 = normal speed (the default), 0.5 = half speed, 2 = double speed, etc. For example, if an animation's `duration` is 2 but its `timeScale` is 0.5, it will take 4 seconds to finish. If you nest that animation in a timeline whose `timeScale` is 0.5 as well, it would take 8 seconds to finish. You can even tween the `timeScale` to gradually slow it down or speed it up.

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining, like `myAnimation.timeScale(2).play(1);`

    var currentTimeScale = myAnimation.timeScale(); //gets current timeScale
    myAnimation.timeScale( 0.5 ); //sets timeScale to half-speed

Parameters

| `value:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

duration()

totalDuration | () | method |

`public function totalDuration(value:Number):*`

Gets or sets the animation's total duration including any repeats or repeatDelays (which are only available in TweenMax and TimelineMax). For example, if a TweenMax instance has a `duration` of 2 and a repeat of 3, its `totalDuration` would be 8 (one standard play plus 3 repeats equals 4 total cycles).

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining, like `myAnimation.totalDuration(2).delay(0.5).play(1);`

     var ctd = myAnimation.totalDuration(); //gets current total duration
     myAnimation.totalDuration(2); //sets total duration

Parameters

| `value:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

duration()
timeScale()

totalTime | () | method |

`public function totalTime(time:Number, suppressEvents:Boolean = false):*`

Gets or sets the position of the playhead according to the `totalDuration` which includes any repeats and repeatDelays (only available in TweenMax and TimelineMax). For example, if a TweenMax instance has a `duration` of 2 and a `repeat` of 3, `totalTime` will go from 0 to 8 during the course of the tween (plays once then repeats 3 times, making 4 total cycles) whereas `time` will go from 0 to 2 a total of 4 times. If you added a `repeatDelay` of 1, that would make the `totalTime` go from 0 to 11 over the course of the tween.

This method serves as both a getter and setter. Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

`totalTime` will never exceed the `totalDuration`, nor will it be less than 0 (values will be clipped appropriately). Negative values will be interpreted from the END of the animation. For example, -2 would be 2 seconds before the end. If the animation's `totalDuration` is 6 and you do `myAnimation.totalTime(-2)`, it will jump to a `totalTime` of 4.

     var tt = myAnimation.totalTime(); //gets total time
     myAnimation.totalTime(2); //sets total time, jumping to new value just like seek().

Parameters

| `time:Number` (default = `NaN`)`` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining. Negative values will be interpreted from the END of the animation.
| `suppressEvents:Boolean` (default = `false`)`` — If `true`, no events or callbacks will be triggered when the playhead moves to the new position defined in the `time` parameter.

Returns

| `*` — Omitting the parameter returns the current value (getter), whereas defining the parameter sets the value (setter) and returns the instance itself for easier chaining.

See also

time()
seek()
play()
reverse()
pause()

Thu Dec 20 2012, 04:30 PM -06:00