Javascript-форум - Progress bar

Решил создать полосу загрузки такую как в HTML5 <progress>
При создании я использовал две свои маленькие функции

dsjs.objStyles=function(styles){
    for(var i=1; i<arguments.length; i++)
        for(var key in styles)
            arguments[i].style[key]=styles[key];
}
dsjs.workCSS3=function(obj,sty,value){
    var masp=['Webkit','Moz','O','Khtml','Ms'];
    if(typeof obj.style[sty]=='string'&&1)obj.style[sty]=value;
    else
        for(var i=0;i<masp.length; i++)
            if(typeof obj.style[masp[i]+sty.charAt(0).toUpperCase()+sty.substring(1,sty.length)]=='string')
                obj.style[masp[i]+sty.charAt(0).toUpperCase()+sty.substring(1,sty.length)]=value;
}

Сам код:

dsjs.createProgress=function(setting){
    var config={},px='px',options={};
    //Значение по умолчанию
    if(typeof setting!='object')setting={};
    if(!setting.height)setting.height=23;
    if(!setting.width)setting.width=104;
    if(!setting.max)setting.max=100;
    if(!setting.value)setting.value=0;
    //Создание Елементов
    var progress=document.createElement('div');
    var progressBorder=document.createElement('div');
    var progressBorderTop=document.createElement('div');
    var progressBorderBottom=document.createElement('div');
    var progressTop=document.createElement('div');
    var progressBottom=document.createElement('div');
    //Соединение елементов
    progress.appendChild(progressBorder);
    progressBorder.appendChild(progressBorderTop);
    progressBorder.appendChild(progressBorderBottom);
    progressBorderTop.appendChild(progressTop);
    progressBorderBottom.appendChild(progressBottom);
    //Параметры по умолчанию
    dsjs.objStyles({padding:'1px',backgroundColor:'rgb(168, 162, 156)',fontSize:'0px'},progress);
    dsjs.objStyles({border:'1px solid black',borderColor:'rgb(248, 247, 246) rgb(207, 200, 193) rgb(207, 199, 192) rgb(207, 200, 193)'},progressBorder);
    dsjs.objStyles({backgroundColor:'rgb(221, 217, 213)'},progressBorderTop);
    dsjs.objStyles({backgroundColor:'rgb(203, 195, 189)'},progressBorderBottom);
    dsjs.objStyles({backgroundColor:'rgb(175, 156, 151)'},progressTop);
    dsjs.objStyles({backgroundColor:'rgb(139, 123, 119)'},progressBottom);
    dsjs.workCSS3(progress,'borderRadius','3px');
    dsjs.workCSS3(progressBorder,'borderRadius','2px');
    dsjs.workCSS3(progressTop,'borderRadius','1px 1px 0px 0px');
    dsjs.workCSS3(progressBorderTop,'borderRadius','1px 1px 0px 0px');
    dsjs.workCSS3(progressBottom,'borderRadius','0px 0px 1px 1px');
    dsjs.workCSS3(progressBorderBottom,'borderRadius','0px 0px 1px 1px');
    //Функции
    config.height=function(valueHeight){
        setting.height=valueHeight;
        progress.style.height=valueHeight-2+px;
        progressBorder.style.height=valueHeight-4+px;
        dsjs.objStyles({height:Math.ceil((valueHeight-4)/2)+px},progressBorderTop,progressTop);
        dsjs.objStyles({height:Math.floor((valueHeight-4)/2)+px},progressBorderBottom,progressBottom);
        return config;
    }
    config.width=function(valueWidth){
        setting.width=valueWidth;
        progress.style.width=valueWidth-2+px;
        dsjs.objStyles({width:valueWidth-4+px},progressBorder,progressBorderTop,progressBorderBottom);
        config.value(setting.value);
        return config;
    }
    config.value=function(valueProgress){
        setting.value=valueProgress;
        progressTop.style.width=progressBottom.style.width=Math.round(((setting.width-4)/setting.max)*valueProgress)+px;
        return config;
    }
    config.max=function(valueMax){
        setting.max=valueMax;
        config.value(setting.value);
        return config;
    }
    config.dom=progress;
    config.height(setting.height).width(setting.width);
    return config;
}

Пример создания

var p1=dsjs.createProgress(false).width(204).height(23).value(50).max(100);
document.body.appendChild(p1.dom);

Весь код

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
    <title>Progress</title>
    <script type="text/javascript">
        var dsjs={}
        dsjs.objStyles=function(styles){
            for(var i=1; i<arguments.length; i++)
                for(var key in styles)
                    arguments[i].style[key]=styles[key];
        }
        dsjs.workCSS3=function(obj,sty,value){
            var masp=['Webkit','Moz','O','Khtml','Ms'];
            if(typeof obj.style[sty]=='string'&&1)obj.style[sty]=value;
            else
                for(var i=0;i<masp.length; i++)
                    if(typeof obj.style[masp[i]+sty.charAt(0).toUpperCase()+sty.substring(1,sty.length)]=='string')
                        obj.style[masp[i]+sty.charAt(0).toUpperCase()+sty.substring(1,sty.length)]=value;
        }
    </script>
    <script type="text/javascript">
        dsjs.createProgress=function(setting){
            var config={},px='px',options={};
            //Значение по умолчанию
            if(typeof setting!='object')setting={};
            if(!setting.height)setting.height=23;
            if(!setting.width)setting.width=104;
            if(!setting.max)setting.max=100;
            if(!setting.value)setting.value=0;
            //Создание элементов
            var progress=document.createElement('div');
            var progressBorder=document.createElement('div');
            var progressBorderTop=document.createElement('div');
            var progressBorderBottom=document.createElement('div');
            var progressTop=document.createElement('div');
            var progressBottom=document.createElement('div');
            //Соединение елементов
            progress.appendChild(progressBorder);
            progressBorder.appendChild(progressBorderTop);
            progressBorder.appendChild(progressBorderBottom);
            progressBorderTop.appendChild(progressTop);
            progressBorderBottom.appendChild(progressBottom);
            //Параметры по умолчанию
            dsjs.objStyles({padding:'1px',backgroundColor:'rgb(168, 162, 156)',fontSize:'0px'},progress);
            dsjs.objStyles({border:'1px solid black',borderColor:'rgb(248, 247, 246) rgb(207, 200, 193) rgb(207, 199, 192) rgb(207, 200, 193)'},progressBorder);
            dsjs.objStyles({backgroundColor:'rgb(221, 217, 213)'},progressBorderTop);
            dsjs.objStyles({backgroundColor:'rgb(203, 195, 189)'},progressBorderBottom);
            dsjs.objStyles({backgroundColor:'rgb(175, 156, 151)'},progressTop);
            dsjs.objStyles({backgroundColor:'rgb(139, 123, 119)'},progressBottom);
            dsjs.workCSS3(progress,'borderRadius','3px');
            dsjs.workCSS3(progressBorder,'borderRadius','2px');
            dsjs.workCSS3(progressTop,'borderRadius','1px 1px 0px 0px');
            dsjs.workCSS3(progressBorderTop,'borderRadius','1px 1px 0px 0px');
            dsjs.workCSS3(progressBottom,'borderRadius','0px 0px 1px 1px');
            dsjs.workCSS3(progressBorderBottom,'borderRadius','0px 0px 1px 1px');
            //Функции
            config.height=function(valueHeight){
                setting.height=valueHeight;
                progress.style.height=valueHeight-2+px;
                progressBorder.style.height=valueHeight-4+px;
                dsjs.objStyles({height:Math.ceil((valueHeight-4)/2)+px},progressBorderTop,progressTop);
                dsjs.objStyles({height:Math.floor((valueHeight-4)/2)+px},progressBorderBottom,progressBottom);
                return config;
            }
            config.width=function(valueWidth){
                setting.width=valueWidth;
                progress.style.width=valueWidth-2+px;
                dsjs.objStyles({width:valueWidth-4+px},progressBorder,progressBorderTop,progressBorderBottom);
                config.value(setting.value);
                return config;
            }
            config.value=function(valueProgress){
                setting.value=valueProgress;
                progressTop.style.width=progressBottom.style.width=Math.round(((setting.width-4)/setting.max)*valueProgress)+px;
                return config;
            }
            config.max=function(valueMax){
                setting.max=valueMax;
                config.value(setting.value);
                return config;
            }
            config.dom=progress;
            config.height(setting.height).width(setting.width);
            return config;
        }
        
        p1=dsjs.createProgress(false).width(204).height(23).value(50).max(100);
        onload=function(){document.body.appendChild(p1.dom);}
        document.onmousemove=function(event){
            if(!event)event=window.event;
            p1.value(event.clientY);
        }
    </script>
</head>
<body>
</body>
</html>