Packagecom.greensock.plugins
Classpublic class ColorPropsPlugin
InheritanceColorPropsPlugin Inheritance TweenPlugin Inheritance Object

Tweens any color-related property of any object, like myObject.borderColor from "rgb(255,0,51)" to "rgb(102,204,0)" (and you can define the initial color in almost any format like "#FF00CC" or "rgba(255,0,51,0.5)" or "red" or "#f0c" or 0xFF00CC). New values are always set in the format "rgb(...)" (or rgba(...) for values that include alpha).

You can tween an unlimited number of color properties simultaneously. Just use the associated property name inside the colorProps:{} object like this:

//tweens myObject.borderColor and myObject.myCustomProp 
TweenLite.to(myObject, 1, {colorProps:{borderColor:"red", myCustomProp:"rgb(204,51,0)"}, ease:Linear.easeNone});

ColorPropsPlugin is NOT generally intended to be used with css-related color properties because the CSSPlugin already handles those. ColorPropsPlugin is meant to tween other color-related properties directly on your JavaScript object(s).

You may even use getter and setter functions on your JavasScript object if you want, so for example let's say your JavaScript object has a getColor() and setColor() method; tweening the value would be as simple as:

//tween a getter/setter-based value
TweenLite.to(myObject, 1, {colorProps:{setColor:"rgb(102,255,51)"}, ease:Linear.easeNone});

This even works for single-method getters/setters (like the ones in jQuery). For example, maybe you have a lineColor() method that serves as a getter and a setter based on whether or not you pass in a parameter like this:

//gets
var color = myObject.lineColor(); 
 
//sets
myObject.lineColor("rgb(255,0,51)"); 
 
//tweens
TweenLite.to(myObject, 1, {colorProps:{lineColor:"rgb(102,255,51)"}, ease:Linear.easeNone});

Note: a common mistake is to forget to wrap color-related properties in a colorProps object which is essential for specifying your intent.

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.