Js_获取浏览器等高宽
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高)
没有定义W3C的标准,则
IE为:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0
FireFox为:
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
Opera为:
document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)
document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)
网页可见区域宽: 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 相对文档的水平座标+垂直方向滚动的量
Js_获取浏览器等高宽的更多相关文章
- jquery获取浏览器各种高宽
$(document).ready(function(){ alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()) ...
- JS获取IMG图片高宽
前段时间在LJW写的touchslider.js轮播代码里添加自适应屏幕大小的功能时,遇到一个问题.不管用什么样的方法都无法获取到IMG标签的高宽,最后只有给图片定一个高宽的比例值:趁今天有空我就写了 ...
- JS 获取浏览器和屏幕宽高等信息代码
JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:doc ...
- javascript获取网页各种高宽及位置总结
screen对象 获取屏幕的高宽(分辨率) screen.width //屏幕的宽 screen.height //屏幕的高 screen.availWidth //屏幕可用宽度 屏幕的像素高度减去系 ...
- JS 获取浏览器和屏幕宽高信息
网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth ...
- jQ获取浏览器window的高宽
Window 对象Window 对象表示浏览器中打开的窗口.JavaScript 层级中的顶层对象,表示浏览器窗口.如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创 ...
- C# 获取当前屏幕的宽高和位置
上一篇博客<C# 获取当前屏幕DPI>,介绍了如何获取当前屏幕的DPI设置 本章主要介绍如何获取当前窗口所在屏幕的信息 当前屏幕信息 如果当前是单屏幕,可以直接获取主屏幕 var prim ...
- LayIM聊天框全屏根据浏览器高宽自适应
个人博客 地址:http://www.wenhaofan.com/article/20190410190628 问题 由于LayIM没有处理聊天框在全屏状态下根据浏览器缩放处理高宽,所以会导致在浏览器 ...
- JavaScript获取浏览器信息的方法
Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息. JavaScript代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 1 ...
随机推荐
- 【转】Linux 高级的视角来查看Linux引导过程
[原文]https://www.toutiao.com/i6594210975480545800/ 1.概述 图 1 是我们在20,000 英尺的高度看到的视图. 当系统首次引导时,或系统被重置时,处 ...
- PHP类继承、接口继承关系概述
PHP类继承: PHP类不支持多继承,也就是子类只能继承一个父类,但是支持多层次继承,比如: class frist{ public function __construct(){ echo &quo ...
- C++第七次作业
关于计算器项目的总结: 一.就目前完成的计算器,包括界面的实现这部分,总体实现了简单计算的功能,但仍有很多不足之处: 需改进完善之处:1.关于界面可再优化: 2.界面放大时,无法自动聚焦(按钮等控件无 ...
- vue2.0学习笔记之组件
[易错点]: 1. 组件内html代码片段超过一个标签时必须套一个根元素,即template模板子元素只能是一个. 2. 组件名称采用横杠间隔命名时,第一个字母大写会报错. 写法一:全局 ...
- IE8 input X 去掉文本框的叉叉和密码输入框的眼睛图标
从IE 10开始,type="text" 的 input 在用户输入内容后,会自动产生一个小叉叉(X),方便用户点击清除已经输入的文本 对于type="password& ...
- webstorm 搭建es6开发环境
本文转自:http://www.jianshu.com/p/26601581e152 1:新建一个Empty Project项目es6 ,然后在src目录下新建了一个es.js: 2:打开设置pref ...
- pdf阅读器开发
文章基于sumatrapdf的实现(当中mupdf中的内容不会太多涉及).以及自己在此基础上做的 优化,扩展.详细效果能够參考百度阅读器精简版. 最NB的还是得属于foxit.渲染速度一流,展示大图片 ...
- 关于Netty Pipeline中Handler的执行顺序问题
原文地址:http://blog.csdn.net/wgyvip/article/details/25637651 最近在学习Netty框架,根据官网的教程学着做了几个小测试,都成功了,后面开始试着写 ...
- 【转】浅谈一个网页打开的全过程(涉及DNS、CDN、Nginx负载均衡等)
1.概要 从用户在浏览器输入域名开始,到web页面加载完毕,这是一个说复杂不复杂,说简单不简单的过程,下文暂且把这个过程称作网页加载过程.下面我将依靠自己的经验,总结一下整个过程.如有错漏,欢迎指正. ...
- shiro实战系列(十四)之配置
Shiro 被设计成能够在任何环境下工作,从最简单的命令行应用程序到最大的的企业群集应用.由于环境的多样性,使得许多配置机制适用于它的配置. 一. 许多配置选项 Shiro的SecurityManag ...