javascript获取浏览器可用区域大小[z]

From: http://www.cnitblog.com/yemoo/archive/2007/06/06/28107.html

用尺寸是一个经常需要用到的信息,由于浏览器不同甚至版本不同,获取的方法也不一样,本文介绍的函数能够兼容各种浏览器,获取这一信息。同时,文章中对浏览器处理这一信息的差异也做了详细说明。

本文所说的“浏览器窗口中文档(下面简称“视口”)可用尺寸”指浏览器中文档显示区域的尺寸,不包括标题栏、工具栏、滚动条等内容。

在处理这一信息时,不同浏览器和同一浏览器不同版本中有一些差别,说明如下:

(1)在 IE4、IE5 和 没有声明 DOCTYPE 的 IE6 中,视口的这一信息保存在“body”元素中,可以用 document.body.offsetWidth / offsetHeight 获取,

(2)在声明了DOCTYPE 的 IE6 中 ,视口的这一信息保存在 document.documentElement 中,可以用 document.documentElement.clientWidth / clientHeight 获取。

(3)除了 IE 以外的所有浏览器都将此信息保存在 window 对象中,可以用 window.innerWidth / innerHeight 获取。


因此,综合上面的说明,我们可以用下面的方式获取浏览器窗口中文档(视口)可用尺寸:

< script type = " text/javascript " >
//  说明:Javascript 获取浏览器窗口中文档(视口)可用尺寸的方法 
//
 整理:http://www.CodeBit.cn  
function  getViewportInfo() {     
    
var  w  =  (window.innerWidth)  ?  window.innerWidth : (document.documentElement  &&  document.documentElement.clientWidth)  ?  document.documentElement.clientWidth : document.body.offsetWidth;     
    
var  h  =  (window.innerHeight)  ?  window.innerHeight : (document.documentElement  &&  document.documentElement.clientHeight)  ?  document.documentElement.clientHeight : document.body.offsetHeight;    
     
return  {w:w,h:h}; 
}; 
</ script >  
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值