位置: 编程技术 - 正文
javascript窗口宽高,鼠标位置,滚动高度(详细解析)(js设置窗口大小)
编辑：rootadmin网页可见区域宽：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
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX 相对文档的水平座标 event.clientY 相对文档的垂直座标 event.offsetX 相对容器的水平坐标 event.offsetY 相对容器的垂直坐标 document.documentElement.scrollTop 垂直方向滚动的值 event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
IE，FireFox 差异如下：
IE6.0、FF1.+：
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5： clientWidth = width - border
clientHeight = height - border
offsetWidth = width
offsetHeight = height
(需要提一下：CSS中的margin属性，与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)
－－－－－－－－－－－－－－－－－－－
本节代码主要使用了Document对象关于窗口的一些属性，这些属性的主要功能和用法如下。
要得到窗口的尺寸，对于不同的浏览器，需要使用不同的属性和方法：
若要检测窗口的真实尺寸，在Netscape下需要使用Window的属性；
在IE下需要深入Document内部对body进行检测；
在DOM环境下，若要得到窗口的尺寸，需要注意根元素的尺寸，而不是元素。
Window对象的innerWidth属性包含当前窗口的内部宽度。
Window对象的innerHeight属性包含当前窗口的内部高度。
Document对象的body属性对应HTML文档的标签。
Document对象的documentElement属性则表示HTML文档的根节点。
document.body.clientHeight表示HTML文档所在窗口的当前高度。
document.body. clientWidth表示HTML文档所在窗口的当前宽度。
实现代码：源程序解读
（1）程序首先建立一个表单，包含两个文本框，用于显示窗口当前的宽度和高度，并且，其数值会随窗口大小的改变而变化。
（2）在随后的JavaScript代码中，首先定义了两个变量winWidth和winHeight，用于保存窗口的高度值和宽度值。
（3）然后，在函数findDimensions ( )中，使用window.innerHeight和window.innerWidth得到窗口的高度和宽度，并将二者保存在前述两个变量中。
（4）再通过深入Document内部对body进行检测，获取窗口大小，并存储在前述两个变量中。
（5）在函数的最后，通过按名称访问表单元素，结果输出至两个文本框。
（6）在JavaScript代码的最后，通过调用findDimensions ( )函数，完成整个操作。
推荐整理分享javascript窗口宽高,鼠标位置,滚动高度(详细解析)(js设置窗口大小)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:js设置窗口大小,js设置页面缩放,js设置浏览器窗口大小,js设置窗口大小,js最大化窗口的方法,js 宽度,js设置控件宽度,js设置浏览器窗口大小,内容如对您有帮助，希望把文章链接给更多的朋友！
NodeJS url验证(url-valid)的使用方法 Javascript做url检验，通常是使用正则表达式来判定，其格式是否正确，例如：/^https?:///.test(url);当然还有更好的检测方法比如基于RFC,RFC,RFC,RFC
NodeJS的url截取模块url-extract的使用实例 上次介绍了怎么利用NodeJS+PhantomJS进行截图，但由于对每次截图操作，都启用了一个PhantomJS进程，所以并发量上去后，效率堪忧，所以我们重写了所有代
ExtJS自定义主题（theme）样式详解 本文基于ExtJS4.2.1版本UI组件基础学习ExtJS就是学习组件的使用。ExtJS4对框架进行了重构，其中最重要的就是形成了一个结构及层次分明的组件体系，由这
标签: js设置窗口大小
本文链接地址:https://www.jiuchutong.com/biancheng/373652.html 转载请保留说明！下一篇：NodeJS url验证(url-valid)的使用方法(node urlencode)
