JavaScript获取屏幕和页面的宽度和高度
2014-03-18 22:25
232 查看
JavaScript获取屏幕和页面的宽度和高度
1、设计源码
2、运行结果
(1)初始化
(2)点击后
1、设计源码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>宽度和高度</title> <script type="text/javascript"> function widthAndHeight() { //网页可见区域宽 var clientWidth = document.body.clientWidth; //网页可见区域高 var clientHeight = document.body.clientHeight; //网页正文全文宽 var scrollWidth = document.body.scrollWidth; //网页正文全文高 var scrollHeight = document.body.scrollHeight; //网页可见区域宽(包括边线的宽) var offWidth = document.body.offsetWidth; //网页可见区域高(包括边线的宽) var offHeight = document.body.offsetHeight; //屏幕分辨率的宽 var screenWidth = window.screen.width; //屏幕分辨率的高 var screenHeight = window.screen.height; //屏幕可用工作区宽度 var avaWidth = window.screen.availWidth; //屏幕可用工作区高度 var avaHeight = window.screen.availHeight; document.writeln("网页可见区域宽:" + clientWidth + "<br>"); document.writeln("网页可见区域高:" + clientHeight + "<br>"); document.writeln("网页正文全文宽:" + scrollWidth + "<br>"); document.writeln("网页正文全文高:" + scrollHeight + "<br>"); document.writeln("网页可见区域宽(包括边线的宽):" + offWidth + "<br>"); document.writeln("网页可见区域高(包括边线的宽):" + offHeight + "<br>"); document.writeln("屏幕分辨率的宽:" + screenWidth + "<br>"); document.writeln("屏幕分辨率的高:" + screenHeight + "<br>"); document.writeln("屏幕可用工作区宽度:" + avaWidth + "<br>"); document.writeln("屏幕可用工作区高度:" + avaHeight + "<br>"); } </script> </head> <body> <input type="button" id="btn" value="宽度和高度" onclick="widthAndHeight()"/> </body> </html>
2、运行结果
(1)初始化
(2)点击后
网页可见区域宽:1309 网页可见区域高:26 网页正文全文宽:1325 网页正文全文高:577 网页可见区域宽(包括边线的宽):1309 网页可见区域高(包括边线的宽):26 屏幕分辨率的宽:1366 屏幕分辨率的高:768 屏幕可用工作区宽度:1366 屏幕可用工作区高度:728
相关文章推荐
- javaScript获取页面,屏幕等高度与宽度
- JavaScript获取屏幕和页面的宽度和高度
- JavaScript获取页面宽度高度及屏幕分辨率
- javascript获取页面宽度高度及屏幕分辨率
- javascript获取页面宽度高度及屏幕分辨率
- JavaScript获取页面宽度高度大全
- javascript:获取屏幕高度和宽度等信息 & 制作滚动窗体时遇到的问题(转)
- Javascript、Jquery获取浏览器和屏幕各种高度宽度
- js获取页面宽度高度及屏幕分辨率
- javascript获取屏幕,浏览器,网页高度宽度
- js获取页面宽度高度及屏幕分辨率
- js获取页面宽度高度及屏幕分辨率
- javascript:获取屏幕高度和宽度等信息 & 制作滚动窗体时遇到的问题
- JavaScript获取页面宽度高度大全
- 【JAVASCRIPT】javascript获取屏幕,浏览器,网页高度宽度
- Javascript、Jquery获取浏览器和屏幕各种高度宽度
- [转] javascript 获取滚动条高度+常用js页面宽度与高度
- JavaScript获取页面宽度高度大全 以及元素的位置
- Javascript、Jquery获取浏览器和屏幕各种高度宽度
- JavaScript、jQuery获取页面及个元素高度、宽度