Js_获取当前对象大小及屏幕分辨率等

来源:互联网 发布:大王卡 知乎 编辑:程序博客网 时间:2024/06/06 13:59

via: http://www.cnblogs.com/tearer/archive/2010/09/06/1819471.html

 

<html>

<head>

<script type="text/javascript">function getInfo(){ 

     var s = "";   

      s += " 网页可见区域宽:"+ document.body.clientWidth+"\n";    

      s += " 网页可见区域高:"+ document.body.clientHeight+"\n";    

      s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+"\n";    

      s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"+"\n";    

      s += " 网页正文全文宽:"+ document.body.scrollWidth+"\n";    

      s += " 网页正文全文高:"+ document.body.scrollHeight+"\n";    

      s += " 网页被卷去的高(ff):"+ document.body.scrollTop+"\n";    

      s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop+"\n";    

      s += " 网页被卷去的左:"+ document.body.scrollLeft+"\n";    

      s += " 网页正文部分上:"+ window.screenTop+"\n";    

      s += " 网页正文部分左:"+ window.screenLeft+"\n";    

      s += " 屏幕分辨率的高:"+ window.screen.height+"\n";    

      s += " 屏幕分辨率的宽:"+ window.screen.width+"\n";    

      s += " 屏幕可用工作区高度:"+ window.screen.availHeight+"\n";    

      s += " 屏幕可用工作区宽度:"+ window.screen.availWidth+"\n";    

      s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"+"\n";    

      s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"+"\n";    

      alert (s);

    }

</script>

</head>

<body onload="getInfo();">

</body>

</html>



 

附:京东商城上根据分辨率调整页面的大小实例

<script type="text/javascript">if (screen.width>=1280){document.write("<style type='text/css'>.w{width:1200px;}.middle{width:766px;}.right-extra{width:983px;}#search{width:332px;padding:1px;}#i-search{width:257px;}#tie{width:257px;}#tie li{width:252px;}#key{width:228px;}#btn-search{background:none;}#hotwords{width:410px;}#service dl{width:192px;padding-left:39px;}#service .fore1{padding-left:20px;}#service .fore5{width:200px;}#service li{padding:0 35px;}#madding-1 dl{width:235px;}#madding-1 .p-price{right:50px;}.madding-2 li,.madding-3 li{width:239px;}#newpros .mc{width:766px;}#newpros .mc ul{width:766px;}#newpros li{width:235px;}#slide{width:766px;}#slide ul{width:766px;}#slide li{width:766px;}.special .mc{width:763px;}.special li{width:234px;}</style>");} </script>

原创粉丝点击