DirectionalRotationPlugin

Tweens any rotation-related property to another value in a particular direction which can be either clockwise ("_cw" suffix), counter-clockwise ("_ccw" suffix), or in the shortest direction ("_short" suffix) in which case the plugin chooses the direction for you based on the shortest path. For example:

//obj.rotation starts at 45
var obj = {rotation:45}; 
 
//tweens to the 270 position in a clockwise direction
TweenLite.to(obj, 1, {directionalRotation:"270_cw"}); 
 
//tweens to the 270 position in a counter-clockwise direction
TweenLite.to(obj, 1, {directionalRotation:"270_ccw"});
 
//tweens to the 270 position in the shortest direction (which, in this case, is counter-clockwise)
TweenLite.to(obj, 1, {directionalRotation:"270_short"});

Notice that the value is in quotes, thus a string with a particular suffix indicating the direction ("_cw", "_ccw", or "_short"). You can also use the "+=" or "-=" prefix to indicate relative values.

Learn more in the DirectionalRotationPlugin documentation.

Get GSAP

Version: 1.19.0 updated 2017-01-17

Core

    Extras

      Plugins

        By using GreenSock code, you agree to the terms of use.

        For an all-access pass to premium content

        Join Club GreenSock