Js中获取显示器、浏览器以及窗口等的宽度与高度的方法
网页可见区域宽: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.availWidths
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.06+:
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.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
Js中获取显示器、浏览器以及窗口等的宽度与高度的方法的更多相关文章
- js中获取当前浏览器类型
本文为博主原创,转载请注明出处: 在应用POI进行导出时,先应用POI进行数据封装,将数据封装到Excel中,然后在进行download下载操作,从而完成 POI导出操作.由于在download操作时 ...
- js中获取窗口高度的方法
取窗口滚动条滚动高度 function getScrollTop() { var scrollTop=0; if(document.documentElement&&document. ...
- js中获取浏览器和屏幕高度
Javascript: IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高 ...
- js中获取css属性
直接获取 window.onload = function() { var but = document.getElementById('button'); var div = document.ge ...
- js中获取URL中指定的查询字符串
js中获取URL中指定的搜索字符串,主要利用location对象实现,废话少说,上代码. function getSearchString(key) { // 获取URL中?之后的字符 var str ...
- 【2017-06-27】Js中获取地址栏参数、Js中字符串截取
一.Js中获取地址栏参数 //从地址栏获取想要的参数 function GetQueryString(name) { var reg = new RegExp("(^|&)" ...
- js中获取css样式属性值
关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...
- js各种获取当前窗口页面宽度、高度的方法
alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height()); //浏览器时下窗口文档的高度 alert($(docum ...
- 小程序 js中获取时间new date()的用法(网络复制过来自用)
js中获取时间new date()的用法 获取时间: 1 var myDate = new Date();//获取系统当前时间 获取特定格式的时间: 1 myDate.getYear(); //获 ...
随机推荐
- android 什么时候call super.onDestory()等
Methods you override that are part of component creation (onCreate(), onStart(), onResume(), etc.), ...
- maven项目对于maven远程仓库没有资源的解决办法
下载资源到本地 方法一:dependency scope 是system 类型 <dependency> <groupId>edu.ucar</groupId> & ...
- PageHelper分页工具
<a>共${page.total}件商品</a> <a>共${page.pages}页</a> <a>当前第${page.pag ...
- 查询和设置mysql事务隔离级别
1.查看当前会话隔离级别 select @@tx_isolation; 2.查看系统当前隔离级别 select @@global.tx_isolation; 3.设置当前会话隔离级别 set sess ...
- jquery 全选获取值
首选区分一下prop与attr的差别.prop是固有属性,attr自定义属性. $("#all").click(function () {//全选.反选 if(this.check ...
- 记录-外挂recovery的制作(魅蓝note)
安卓的开源使其具有很强的可定制性,对于用户来说很具有可玩性.玩机一般来说就是解锁BootLoader刷入第三方recovery,利用第三方recovery刷第三方ROM,刷supersu获取root权 ...
- JAVA 数据筛选(第一笔数据与第二笔数据比较)
第一笔数据与第二笔数据比较 Map<String, Object> jHpictureMap = new HashMap<String, Object>(); // 存放照片S ...
- Continuous Integration with Selenium
I have seen a lot of queries from people who basically want to know how to blend Selenium, Maven, an ...
- 常用PHP MySQL函数
配置选项 MySQL 函数的行为受到 php.ini 中设置的影响. mysql.allow_persistent "1" 是否允许 MySQL 的持久连接. mysql.max_ ...
- MapReduce 1工作原理图文详解
MapReduce工作原理图文详解 一 MapReduce程序执行流程 程序执行流程图如下: 流程分析:1.在客户端启动一个作业.2.向JobTracker请求一个Job ID.3.将运行作业所需要的 ...