Jquery中文网 www.jquerycn.cn
Jquery中文网 >  脚本编程  >  javascript  >  正文 js获取浏览器与屏幕宽度高度

js获取浏览器与屏幕宽度高度

发布时间:2015-06-07   编辑:www.jquerycn.cn
本文介绍了js获取屏幕宽度与高度的方法,分享一例获取浏览器即屏幕尺寸信息的代码,有需要的朋友参考下。

在js操作dom时,经常用到浏览器的高度和宽度来调节dom的位置。

例如:
 

复制代码 代码示例:
<script language="javascript">
function getdocumentsize(){
var str = '';
str+=document.body.clientwidth+"\r\n";//网页可见区域宽
str+=document.body.clientheight+"\r\n";//网页可见区域高
str+=document.body.offsetwidth+"\r\n";//网页可见区域高(包括边线的宽)
str+=document.body.offsetheight+"\r\n";//网页可见区域高(包括边线的宽)
str+=document.body.scrollwidth+"\r\n";//网页正文全文宽
str+=document.body.scrollheight+"\r\n";//网页正文全文高
str+=document.body.scrolltop+"\r\n";//网页被卷去的高
str+=document.body.scrollleft+"\r\n";//网页被卷去的左
str+=window.screentop+"\r\n";//网页正文部分上
str+=window.screenleft+"\r\n";//网页正文部分左
str+=window.screen.height+"\r\n";//屏幕分辨率的高
str+=window.screen.width+"\r\n";//屏幕分辨率的宽
str+=window.screen.availheight+"\r\n";//屏幕可用工作区高度
str+=window.screen.availwidth+"\r\n";//屏幕可用工作区宽度
alert(str);
}
</script>

代码说明:
1、document.body.scrolltop与document.body.clientheight有时是无效的,究其原因是因为声明了doctype:
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
当声明了doctype以后,document.body.scrolltop的值永远等于0。

解决办法:
将document.body用document.documentelement替换即可。

2、window.screentop 与window.screenleft在firefox中是没有定义的,它仅能在ie里发挥作用,指的是网页正文部分上与显示器屏幕上的边的距离。
其实这个高度也是很有用的,当需要使用open函数打开一个窗口时,即可利用这个距离来给新打开的窗口定位。

js获取屏幕宽度实例代码
js获取屏幕宽度代码分享
js获取屏幕高度 js屏幕属性信息
js获取屏幕高度与宽度
js与jquery获取屏幕宽度与高度
js 获取浏览器与屏幕宽高信息
JS和jquery获取浏览器屏幕的宽度与高度
js获取浏览器屏幕宽高的方法(浏览器兼容)
JS获取屏幕、浏览器窗口大小、网页高度宽度的方法详解

您可能感兴趣的文章:
js获取屏幕高度与宽度
JS获取屏幕尺寸大小实例
js获取浏览器宽度\屏幕宽度\显示器分辨率
js与jquery获取屏幕宽度与高度
JS获取屏幕高度与宽度方法
js获取屏幕分辨率示例
js获取浏览器与屏幕宽度高度
js与Jquery获取屏幕的宽度和高度的方法
js获取浏览器窗口大小与屏幕宽高
js获取屏幕高度 js屏幕属性信息

[关闭]