一个页面根据显示器分辨率的不同调用不同的背景图片,或者根据显示器分辨率的不同调用不同的css文件。请问该如何实现,在线等。

解决方案 »

  1.   

    js脚本
    屏幕分辨率的高:window.screen.height
    屏幕分辨率的宽:window.screen.width利用JS根据宽高来设置页面的背景图片
      

  2.   


    网页可见区域宽: document.body.clientWidth
    网页可见区域高: document.body.clientHeight
    网页可见区域宽: document.body.offsetWidth (包括边线的宽)
    网页可见区域高: document.body.offsetHeight (包括边线的高)
    网页正文全文宽: document.body.scrollWidth
    网页正文全文高: document.body.scrollHeight
    网页被卷去的高: document.body.scrollTop
    网页被卷去的左: document.body.scrollLeft
    网页正文部分上: window.screenTop
    网页正文部分左: window.screenLeft
    屏幕分辨率的高: window.screen.height
    屏幕分辨率的宽: window.screen.width
    屏幕可用工作区高度: window.screen.availHeight
    屏幕可用工作区宽度: window.screen.availWidth   <script language="javascript">
    function screenInfo(){
        var  s = "";
       s += "\r\n网页可见区域宽:"+ document.body.clientWidth;
       s += "\r\n网页可见区域高:"+ document.body.clientHeight;
       s += "\r\n网页可见区域宽:"+ document.body.offsetWidth  +" (包括边线的宽)";
       s += "\r\n网页可见区域高:"+ document.body.offsetHeight +" (包括边线的宽)";
       s += "\r\n网页正文全文宽:"+ document.body.scrollWidth;
       s += "\r\n网页正文全文高:"+ document.body.scrollHeight;
       s += "\r\n网页被卷去的高:"+ document.body.scrollTop;
       s += "\r\n网页被卷去的左:"+ document.body.scrollLeft;
       s += "\r\n网页正文部分上:"+ window.screenTop;
       s += "\r\n网页正文部分左:"+ window.screenLeft;
       s += "\r\n屏幕分辨率的高:"+ window.screen.height;
       s += "\r\n屏幕分辨率的宽:"+ window.screen.width;
       s += "\r\n屏幕可用工作区高度:"+ window.screen.availHeight;
       s += "\r\n屏幕可用工作区宽度:"+ window.screen.availWidth;
       alert(s);
    }
    </script>
    本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/java_pengjin/archive/2010/12/30/6107705.aspx
      

  3.   

    得到分辨率的方法,上面都讲了。
    补充一下更改样式的方法:
    如果是整个页面的背景图片,只要更改body的background-image即可,用不着更换CSS文件。
    如果涉及很多对象的背景及其它样式设置,才需更换CSS。1。利用createElement("link")来创建样式,设置CSS文件名称,将link对象加入HEAD头中。2。将几个CSS的LINK标签都事先写进去,将一个作为默认,其它的都加上disable禁止生效。然后在JS得到分辨率后将对应的LINK解禁而将其它LINK再禁止。