JS Tween 颜色渐变

　　有31中缓动算法，实现了颜色的自动转换（#f00 #ff0000 rgb(255,0,0)格式到颜色运算格式，最后返回#ff0000格式）、px单位的自动转换。

　　调用接口：

　　/**

　　* 对外接口

　　* Tween的示例

　　* @param startProps 开始属性，单个属性或者数组

　　* @param endProps 结束属性，单个属性或者数组

　　* @param timeSeconds 运动消耗时间，单位秒

　　* @param animType 动作类型，字符串型，内部自己转换算子

　　* @param delay 延迟时间，多长时间后开始运动，单位秒

　　*/

　　window.rtween = function(startProps, endProps, timeSeconds, animType, delay)

　　{

　　var tw = new Tween();

　　tw.start(startProps, endProps, timeSeconds, animType, delay);

　　return tw;

　　}

　　示例如下：

　　http://dl.glzy8.com/img/online/Tween.htm

　　

　　选择列表里面的缓动算法，点前面的按钮，就会以想对的缓动算法运动

　　源代码： http://dl.glzy8.com/img/jslib/jquery/rtween.js

　　核心代码:

　　function Tween()

　　{

　　this._frame=20;

　　//

　　this._animType = linear;

　　this._delay = 0;

　　//

　　this.run = function(){}

　　this.complete = function(){}

　　}

　　//

　　Tween.prototype.getValue = function(prop)

　　{

　　this._valueType = ”;

　　if(prop.constructor == Array) return prop;

　　//

　　if(typeof(prop) == 'string')

　　{

　　if(isColor(prop))

　　{

　　this._valueType = ‘color';

　　return c2a(prop);

　　}

　　if(prop.split('px').length>1)

　　{

　　this._valueType = ‘px';

　　return [prop.split('px')[0]];

　　}

　　}

　　return [prop];

　　}

　　Tween.prototype.setValue = function(prop)

　　{

　　if(this._valueType == ‘color')return a2c(prop);

　　if(this._valueType == ‘px')return prop[0]+'px';

　　return prop;

　　}

　　Tween.prototype.start = function(startProps, endProps, timeSeconds, animType, delay)

　　{

　　if(animType != undefined)this._animType = this.animTypes[animType];

　　if(delay != undefined)this._delay = delay;

　　//

　　this._timeSeconds = timeSeconds;

　　this._startTimer = new Date().getTime() + this._delay * 1000;

　　//

　　this._endProps = this.getValue(endProps);

　　this._startProps = this.getValue(startProps);

　　this._currentProps = [];

　　//

　　var $this = this;

　　clearInterval(this._runID);

　　this._runID = setInterval(

　　function(){$this._run();}

　　,this._frame);

　　}

　　Tween.prototype.stop = function(state)

　　{

　　for(var i in this._startProps)

　　{

　　if(Number(state)>0)

　　this._currentProps[i] = this._endProps[i];

　　else if(Number(state)<0)

　　this._currentProps[i] = this._startProps[i];

　　}

　　this.callListener();

　　this.complete();

　　//

　　clearInterval(this._runID);

　　}

　　Tween.prototype.callListener = function()

　　{

　　this.run(this.setValue(this._currentProps));

　　}

　　Tween.prototype._run = function()

　　{

　　if ( new Date().getTime()- this._startTimer< 0) return;

　　var isEnd = false;

　　//

　　for(var i in this._startProps)

　　{

　　this._currentProps[i] = this._animType( new Date().getTime()-this._startTimer,Number(this._startProps[i]),Number(this._endProps[i])-Number(this._startProps[i]),this._timeSeconds * 1000);

　　//

　　if(this._startTimer + (this._timeSeconds * 1000) <= new Date().getTime())

　　{

　　this._currentProps[i] = this._endProps[i];

　　isEnd = true;

　　}

　　}

　　//

　　if(isEnd)this.stop();

　　else this.callListener();

　　}