现在的位置: 首页 > 综合 > 正文

动态改变引入的CSS文件

2012年09月05日 ⁄ 综合 ⁄ 共 2381字 ⁄ 字号 评论关闭
        window.onload = function(){
            setLineTextFrontWidth();
        }
        function setLineTextFrontWidth(){
            var curTotalWidth = (document.documentElement.clientWidth == 0) ? document.body.clientWidth : document.documentElement.clientWidth;
            if(curTotalWidth<=100){ return; }
            curTotalWidth = curTotalWidth - 100;
            var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
            var hasChangeL1 = false;
            var hasChangeL2 = false;
            for(var x=0;x<classes.length;x++) {
                if( classes[x].selectorText=='.LineText1Front' ) {
                    hasChangeL1 = true;
                       classes[x].style.width = '' + curTotalWidth + 'px';
                }else if(classes[x].selectorText=='.LineText2Front'){
                    hasChangeL2 = true;
                       classes[x].style.width = '' + curTotalWidth + 'px';
                }
                if( hasChangeL1 && hasChangeL2 ){
                    break;
                }
            }
        }

 

再优化一次多分辨率CSS模式及窗口改变也进行处理 

    window.onload = function(){
            setLineTextFrontWidth();
        }
        window.onresize = function(){
            setLineTextFrontWidth();
        }
function setLineTextFrontWidth(){
    var curTotalWidth = (document.documentElement.clientWidth == 0) ? document.body.clientWidth : document.documentElement.clientWidth;
    if(curTotalWidth<=100){ return; }
    var vFontWidth = curTotalWidth - 100;
    var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
    if(curTotalWidth>=1024){
        setLineTextFrontWidthByMinWidth(classes,vFontWidth,1024);
    }else{
        setLineTextFrontWidthStyle(classes,vFontWidth);
    }
}
function setLineTextFrontWidthStyle(vClass,vWidthPx){
    for(var x=0;x<vClass.length;x++) {
        if( vClass[x].selectorText=='.LineText1Front' || vClass[x].selectorText=='.LineText2Front' ) {
                vClass[x].style.width = '' + vWidthPx + 'px';
        }
    }
}
function setLineTextFrontWidthByMinWidth(vClass,vWidthPx,vMinWidth){
    for(var x=0;x<vClass.length;x++) {
        if (vClass[x].type == '4' && vClass[x].media.mediaText == 'only screen and (min-width: '+vMinWidth+'px)') {
             var classes = vClass[x].rules || vClass[x].cssRules;
             setLineTextFrontWidthStyle(classes,vWidthPx);
             break;
         }
    }

} 

抱歉!评论已关闭.