from: http://www.xiaoboy.com/detail/1341545044.html

所谓可视区域是指能看得见的区域,即在浏览器中能看到页面的区域(高度与宽度)。刚刚使用 document.body.clientHeight 来获取可视区域的高度得到的却是整个文档的高度,然后在cnblogs.com的一篇文章中获知需要通过 document.documentElement.clientHeight 才能获取到浏览器的可视区域的高度,顺便将该文章摘下来,如下:

在没有声明DOCTYPE的IE中,浏览器显示窗口大小只能以下获取:

1
2
document.body.offsetWidth
document.body.offsetHeight

在声明了DOCTYPE的浏览器中,可以用以下来获取浏览器显示窗口大小:

1
2
document.documentElement.clientWidth
document.documentElement.clientHeight

IE,FF,Safari皆支持该方法,opera虽支持该属性,但是返回的是页面尺寸;

同时,除了IE以外的所有浏览器都将此信息保存在window对象中,可以用以下获取:

1
2
window.innerWidth
window.innerHeight

摘自《记录前端那些事儿》

【转】JS获取浏览器可视区域的尺寸的更多相关文章

  1. JS获取浏览器可视区域的尺寸

    所谓可视区域是指能看得见的区域,即在浏览器中能看到页面的区域(高度与宽度).刚刚使用 document.body.clientHeight 来获取可视区域的高度得到的却是整个文档的高度,然后在cnbl ...

  2. JS获取浏览器可视区域尺寸

    本文所说的是浏览器窗口的可视区域大小,不是浏览器窗口大小,也非页面尺寸. 在没有声明DOCTYPE的IE中,浏览器显示窗口大小只能以下获取: document.body.offsetWidth doc ...

  3. js 获取页面可视区域宽高

    获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下. 1.IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下 document.body.offsetWidth d ...

  4. 记录一下获取浏览器可视区域的大小的js

    function GetPageSize() { var xScroll, yScroll; if (window.innerHeight && window.scrollMaxY) ...

  5. js 获取浏览器可视窗口大小,滚动条高度

    // 获取窗口宽度 if (window.innerWidth) winWidth = window.innerWidth; else if ((document.body) && ( ...

  6. js获取浏览器当前窗口的高度长度

    js获取浏览器可见区域(不包括标题栏.地址栏.收藏夹栏状态栏等额外区域,仅为页面呈现区域)的高度和宽度宽度:document.documentElement.clientWidth高度:documen ...

  7. 原生JS 获取浏览器、窗口、元素等尺寸的方法及注意事项

    一.通过浏览器获得屏幕的尺寸 screen.width screen.height screen.availHeight //获取去除状态栏后的屏幕高度 screen.availWidth //获取去 ...

  8. JS 获取浏览器窗口大小

    JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...

  9. JS 获取浏览器和屏幕宽高等信息代码

    JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:doc ...

随机推荐

  1. C、C++ 学习经历

    1.可以考虑先学习C. 大多数时候,我们学习语言的目的,不是为了成为一个语言专家,而是希望成为一个解决问题的专家.做一个有用的程序员,做一个赚钱的程序员.我们的价值,将体现在客户价值上,而不是语言写得 ...

  2. JS 显示周 几和 月 日

    function getMyDay(date){ var week; ; var day = date.getDate(); ) week="周日" ) week="周一 ...

  3. DateTables的服务器分页

    function InitTable() { var table = $('#tbl_users').DataTable(); if ($.fn.dataTable.isDataTable('#tbl ...

  4. 1.1 lambda表达式

    一.处理匿名内部类 1.Runnable接口 new Thread(new Runnable() { public void run() { System.out.println("hell ...

  5. 树莓派3中编译Opencv3.4.10

    一.命令 -dev libv4l-dev libavcodec-dev libavformat-dev libswscale-dev cd wget http://sourceforge.net/pr ...

  6. Spark机器学习(1):线性回归算法

    线性回归算法,是利用数理统计中回归分析,来确定两种或两种以上变量间相互依赖的定量关系的一种统计分析方法. 1. 梯度下降法 线性回归可以使用最小二乘法,但是速度比较慢,因此一般使用梯度下降法(Grad ...

  7. Atlas+Keepalived系列一:安装Atlas:

    1:下载Atlas https://github.com/Qihoo360/Atlas/releases/download/2.2.1/Atlas-2.2.1.el6.x86_64.rpm 2:安装A ...

  8. 四舍五入函数ROUND(x,y)

    四舍五入函数ROUND(x,y) 参数: x:数据 y:需要保留的小数点位数 ROUND(x,y)函数返回最接近于参数x的数,其值保留到小数点后面y位,若y为负值,则将保留x值到小数点左边y位. my ...

  9. JDK自带的运行监控工具JConsole观察分析Java程序的运行

    原文地址:https://blog.csdn.net/libaolin198706231987/article/details/55057149 一.JConsole是什么 从Java 5开始 引入了 ...

  10. More than the maximum number of request parameters

    前些时间,我们的的一个管理系统出现了点问题,原本运行的好好的功能,业务方突然讲不行了,那个应用已经运行了好多年了,并且对应的代码最近谁也没改动过,好奇怪的问题,为了解决此问题,我们查看了日志,发现请求 ...