关注前端开发
关注用户体验

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

本文所说的是浏览器窗口的可视区域大小,不是浏览器窗口大小,也非页面尺寸。

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

document.body.offsetWidth
document.body.offsetHeight

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

document.documentElement.clientWidth
document.documentElement.clientHeight

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

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

window.innerWidth
window.innerHeight
未经允许不得转载:大前端 » JS获取浏览器可视区域尺寸
分享到:更多 ()

评论 16

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #11

    $(document).height();

    6662个月前 (02-05)回复
  2. #10

    好 好 好

    6662个月前 (02-05)回复
  3. #9

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

    document.documentElement.clientWidth
    document.documentElement.clientHeight

    请问下。。JQ有没简洁点方法?

    waitngbar10145年前 (2011-12-12)回复
    • 同求

      nj6764年前 (2013-08-27)回复
    • $(document).height();

      6662个月前 (02-05)回复
  4. #8

    不是太懂啊

    菜鸟一个6年前 (2011-07-20)回复
  5. #7

    一般doctype应该都是要加上的吧. 个人以为是个好习惯. 所以第二种更靠谱点~~

    ADD~``6年前 (2011-07-12)回复
    • 当然,标准化很有必要

      浩子6年前 (2011-07-12)回复
  6. #6

    好东西,学习,分享~

    弓弩专卖6年前 (2011-07-12)回复
  7. #5

    支持一下~最近发现FF对于一些属性也不兼容

    Maplews6年前 (2011-07-08)回复
  8. #4

    显示器分辩率调成1600X900,我感觉是最好的

    capsiplex6年前 (2011-07-08)回复
  9. #3

    我对这不懂, 希望博主 分享好的作品,我们好学习

    卡其视觉6年前 (2011-07-08)回复
  10. #2

    我的显示器分辩率1600X900, ❓ 用IE和F测试了一下,都不是返回这两个值。

    enzolinc6年前 (2011-07-07)回复
    • 返回的是浏览器可视区域,而不是屏幕分辨率。

      老康6年前 (2011-07-17)回复
  11. #1

    小技巧哇。

    优艾点6年前 (2011-07-07)回复

themebetter 国内更好的WordPress主题服务商

立即前往