一个自定义背景色渐变对象，弥补jQuery的animate函数不足

一个自定义对象fadeColor，来看下底层代码：

window.Sys = function (ua){
    var b = {
        ie: /msie/.test(ua) && !/opera/.test(ua),
        opera: /opera/.test(ua),
        safari: /webkit/.test(ua) && !/chrome/.test(ua),
        firefox: /firefox/.test(ua),
        chrome: /chrome/.test(ua)
    },vMark = "";
    for (var i in b) {
        if (b[i]) { vMark = "safari" == i ? "version" : i; break; }
    }
    b.version = vMark && RegExp("(?:" + vMark + ")[\\/: ]([\\d.]+)").test(ua) ? RegExp.$1 : "0";
    b.ie6 = b.ie && parseInt(b.version, 10) == 6;
    b.ie7 = b.ie && parseInt(b.version, 10) == 7;
    b.ie8 = b.ie && parseInt(b.version, 10) == 8;   
    return b;
}(window.navigator.userAgent.toLowerCase());
function toHex(num){
    var str = "0"+num.toString(16);
    return str.substring(str.length-2);
}
function fadeColor(obj){
    this.obj = obj;
    this.bgTimer = null;
    this.foreTimer = null;
    this.FPS = 20;
};
fadeColor.prototype = {
    getSrcColor:function(flag){
        var srcColor,sR,sG,sB;
        if(flag){   //bgColor
            if(window.Sys.ie){
                srcColor = this.obj.currentStyle.backgroundColor
            }
            else{
                var myComputedStyle = document.defaultView.getComputedStyle(this.obj, null);
                srcColor = myComputedStyle.backgroundColor
            }
        }
        else{   //foreColor
            if(window.Sys.ie){
                srcColor = this.obj.currentStyle.color
            }
            else{
                var myComputedStyle = document.defaultView.getComputedStyle(this.obj, null);
                srcColor = myComputedStyle.color
            }
        }
        if(window.Sys.ie){
            sR = parseInt(srcColor.substring(1,3),16);
            sG = parseInt(srcColor.substring(3,5),16);
            sB = parseInt(srcColor.substring(5),16);
        }
        else{
            sR = srcColor.match(/\d+/ig)[0];
            sG = srcColor.match(/\d+/ig)[1];
            sB = srcColor.match(/\d+/ig)[2];
        }
        return (eval("({sR:"+sR+",sG:"+sG+",sB:"+sB+"})"));
    },
    startTimer:function(destColor,duration,flag){
        var sR,sG,sB,dR,dG,dB,offR,offG,offB,stepR,stepG,stepB,srcColor,maxOffset,step;
        var _self = this;
        srcColor = _self.getSrcColor(flag);
        sR = srcColor.sR;
        sG = srcColor.sG;
        sB = srcColor.sB;    
        dR = parseInt(destColor.substring(1,3),16);
        dG = parseInt(destColor.substring(3,5),16);
        dB = parseInt(destColor.substring(5),16);    
        offR = dR - sR;
        offG = dG - sG;
        offB = dB - sB;
        maxOffset = Math.max(Math.abs(offR),Math.abs(offG));
        maxOffset = Math.max(maxOffset,Math.abs(offB));
        step = Math.ceil(maxOffset/Math.round(_self.FPS/1000*duration));
        stepR = (offR == 0 ? 0 : step * (offR / Math.abs(offR)));
        stepG = (offG == 0 ? 0 : step * (offG / Math.abs(offG)));
        stepB = (offB == 0 ? 0 : step * (offB / Math.abs(offB)));
        if(flag){  //bgColor
            _self.bgTimer = setInterval(function(){
                sR += stepR;
                sG += stepG;
                sB += stepB;
                sR = (offR > 0 ? Math.min(sR ,dR) : Math.max(sR,dR));
                sG = (offG > 0 ? Math.min(sG ,dG) : Math.max(sG,dG));
                sB = (offB > 0 ? Math.min(sB ,dB) : Math.max(sB,dB));
                if(sR == dR && sG == dG && sB == dB){
                    clearInterval(_self.bgTimer);
                }
                _self.obj.style.backgroundColor = "#"+toHex(sR)+toHex(sG)+toHex(sB);
            },_self.FPS);
        }
        else{  //foreColor
            _self.foreTimer = setInterval(function(){
                sR += stepR;
                sG += stepG;
                sB += stepB;
                sR = (offR > 0 ? Math.min(sR ,dR) : Math.max(sR,dR));
                sG = (offG > 0 ? Math.min(sG ,dG) : Math.max(sG,dG));
                sB = (offB > 0 ? Math.min(sB ,dB) : Math.max(sB,dB));
                if(sR == dR && sG == dG && sB == dB){
                    clearInterval(_self.foreTimer);
                }
                _self.obj.style.color = "#"+toHex(sR)+toHex(sG)+toHex(sB);
            },_self.FPS);
        }
    },
    fadeBgColor:function(destColor , duration){
        this.stopTimer(1);
        this.startTimer(destColor , duration ,1);
    },
    fadeForeColor:function(destColor , duration){
        this.stopTimer(0);
        this.startTimer(destColor , duration ,0);
    },
    stopTimer:function(flag){
        if(flag){
            clearInterval(this.bgTimer);
            this.bgTimer = null;
        }
        else{
            clearInterval(this.foreTimer);
            this.foreTimer = null;
        }
    },
    setFPS:function(fps){
        this.FPS = fps;
    }
};

调用方法：

window.onload = function(){
    var test = document.getElementById("test");  //test为页面中的一个DOM元素。
    var fadeObj;
    fadeObj = new fadeColor(test);
    test.onmouseover = function(){
       fadeObj.fadeBgColor("#FFFFFF",1000);
       fadeObj.fadeForeColor("#000000",1000);
    };
    test.onmouseout = function(){
       fadeObj.fadeBgColor("#5d5c5c",1000);
       fadeObj.fadeForeColor("#FFFFFF",1000);
    };
}