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

Package | com.greensock.plugins
Class | public class ColorPropsPlugin
Inheritance | ColorPropsPlugin TweenPlugin 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.

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