Javascript、Jquery获取浏览器和屏幕各种高度宽度（单位都为px）
Javascript、Jquery获取浏览器和屏幕各种高度宽度
另外参见 http://www.cnblogs.com/top5/archive/2009/05/07/1452135.html
Javascript:
IE中：
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度
FireFox中：
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度
Opera中：
document.body.clientWidth ==> 可见区域宽度
document.body.clientHeight ==> 可见区域高度
document.documentElement.clientWidth ==> 页面对象宽度（即BODY对象宽度加上Margin宽）
document.documentElement.clientHeight ==> 页面对象高度（即BODY对象高度加上Margin高）
alert(document.body.clientWidth); //网页可见区域宽(body)
alert(document.body.clientHeight); //网页可见区域高(body)
alert(document.body.offsetWidth); //网页可见区域宽(body)，包括border、margin等
alert(document.body.offsetHeight); //网页可见区域宽(body)，包括border、margin等
alert(document.body.scrollWidth); //网页正文全文宽，包括有滚动条时的未见区域
alert(document.body.scrollHeight); //网页正文全文高，包括有滚动条时的未见区域
alert(document.body.scrollTop); //网页被卷去的Top(滚动条)
alert(document.body.scrollLeft); //网页被卷去的Left(滚动条)
alert(window.screenTop); //浏览器距离Top
alert(window.screenLeft); //浏览器距离Left
alert(window.screen.height); //屏幕分辨率的高
alert(window.screen.width); //屏幕分辨率的宽
alert(window.screen.availHeight); //屏幕可用工作区的高
alert(window.screen.availWidth); //屏幕可用工作区的宽
Jquery 【jquery貌似不能直接获取屏幕宽高】
alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height()); //浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true)); //浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width()); //浏览器当前窗口文档对象宽度
alert($(document.body).width()); //浏览器当前窗口文档body的宽度
alert($(document.body).outerWidth(true)); //浏览器当前窗口文档body的总宽度 包括border padding margin
1 <!DOCTYPE html> 2 <script src="jquery-1.5.1.min.js" type="text/javascript"></script> 3 <html> 4 <head> 5 <title>aaa</title> 6 </head> 7 <body> 8 <h1>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa 9 aaaaaaaaaaaaaaaaaa</h1> 10 <p>Welcome to aaa</p> 11 <h1>aaa</h1> 12 <h1>aaa</h1> 13 <h1>aaa</h1> 14 <h1>aaa</h1> 15 <h1>aaa</h1> 16 <h1>aaa</h1> 17 <h1>aaa</h1> 18 <h1>aaa</h1> 19 <h1>aaa</h1> 20 <h1>aaa</h1> 21 <h1>aaa</h1> 22 <h1>aaa</h1> 23 <h1>aaa</h1> 24 </body> 25 </html> 26 27 <script type="text/javascript"> 28 alert(document.body.clientWidth); 29 alert(document.body.clientHeight); 30 alert(document.body.offsetWidth); 31 alert(document.body.offsetHeight); 32 33 alert(document.body.scrollWidth); 34 alert(document.body.scrollHeight); 35 36 alert(document.body.scrollTop); 37 alert(document.body.scrollLeft); 38 alert(window.screenTop); 39 alert(window.screenLeft); 40 alert(window.screen.height); 41 alert(window.screen.width); 42 alert(window.screen.availHeight); 43 alert(window.screen.availWidth); 44 45 //alert($(document).height()); 46 //alert($(document).width()); 47 </script>
Javascript、Jquery获取浏览器和屏幕各种高度宽度（单位都为px）的更多相关文章
- Javascript&Jquery获取浏览器和屏幕各种高度宽度方法总结及运用
<js篇> Javascript获取浏览器和屏幕各种高度宽度方法总结 document.body.clientWidth //网页可见区域宽(body) document.bo ...
- Javascript、Jquery获取浏览器和屏幕各种高度宽度
Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度d ...
- Javascript、Jquery获取浏览器和屏幕各种高度宽度[mark]
Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度d ...
- JS、Jquery获取浏览器和屏幕各种高度宽度
网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth ...
- JS、JQUERY 获取浏览器和屏幕各种高度宽度
好长时间没有更新博客了... 把我最近积累的一点知识点放上博客,以后以备不需之要,也给大家整理一下.. Javascript: IE中:document.body.clientWidth ==> ...
- C#-WebForm-Javascript、Jquery获取浏览器和屏幕各种高度宽度
Javascript: IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度d ...
- Jq_Js_Js、Jq获取浏览器和屏幕各种高度宽度
$(document).ready(function() {alert($(window).height()); //浏览器当前窗口可视区域高度alert($(document).he ...
- js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码
获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下: document.body.offsetWidth doc ...
- js 和 jquery 获取页面和滚动条的高度 视口高度文档高度
js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...
随机推荐
- FortiGate恢复出厂
1.需求 当需要把设备的所有配置删除,可进行恢复出厂操作.恢复出厂后所有配置都将丢失,若一定要恢复出厂设置建议前先备份当前的配置:备份配置操作步骤请参见"系统管理">> ...
- Python中操作SQLAlchemy
一.ORM 框架简介 对象-关系映射(Object/Relation Mapping,简称ORM),是随着面向对象的软件开发方法发展而产生的.面向对象的开发方法是当今企业级应用开发环境中的主流开发方法 ...
- swift - xcode10 - 点击事件交互BUG - （手势和button的addTarget方法）
1. 现象button 点击闪退:没有任何原因 ,在听云检测上,显示 BUG2: 手势 没有任何作用,哪怕设置 isUserInteractionEnabled 和isEnabled 为true 都 ...
- ALV界面显示
PERFORM ADD. IS_LAYOUT_LVC-CWIDTH_OPT = 'X'. IS_LAYOUT_LVC-SEL_MODE = 'A'. CALL FUNCTION 'REUSE_ ...
- JFinal Web开发学习(三)前后台路由设计
效果图: 一.写控制器 1.在controller包中新建AdminController后台控制器,继承Controller,实现一个index方法,作为的处理方法. /admin 后面,这个控制器中 ...
- Struts2框架之Action类的访问
1. 通过<action>标签中的method属性,访问到Action中的具体的方法. * 传统的配置方式,配置更清晰更好理解!但是扩展需要修改配置文件等! * 具体的实例如下: * 页面 ...
- 安装git工具在ubuntu系统
Git is one of the most popular tools used for distributed version control system(VCS). Git is common ...
- input，textarea在ios和Android上阴影和边框的处理方法（在移动端）
1.去掉ios上阴影的方法只需要在css文件上添加input,textarea{-webkit-appearance: none;}就可以了 2.在移动端上input和textarea边框问题,也是在 ...
- 在Qt(C++)中与Python混合编程
一.PythonQt库 在Qt(C++)中与Python混合编程,可以使用PythonQt库. 网站首页:http://pythonqt.sourceforge.net 下载页面:https://so ...
- hadoop 启动的时候datanode报错 Problem connecting to server
刚配置好的hadoop,namenode可以正常开启,但是datanode却不停的报错,并且不能正常启动: 2014-05-04 10:43:33,970 WARNorg.apache.hadoop. ...