获取可用的浏览器窗口大小（clientHeight / clientWidth）一直在多个浏览器 [英] Get the available browser window size (clientHeight/clientWidth) consistently across multiple browsers

问题描述

我想获得可用的窗口大小的方法，跨浏览器的没有的使用jQuery / Mootools的/任何第三方库的依赖。我已经做了一些研究这一点，但一半的事情我已经遇到说说Netscape Navigator中...

I would like a method of getting the available window size across multiple browsers without using jQuery/Mootools/any third-party library dependencies. I've done a little research on this but half the things I've come across talk about Netscape Navigator...

只是想知道，如果有人在那里有更近的意见。

Just wondering if someone out there has more recent advice.

推荐答案

的使用的

var width = getWindowSize().width;

的 code 的

var getWindowSize = (function() {
  var docEl = document.documentElement,
      IS_BODY_ACTING_ROOT = docEl && docEl.clientHeight === 0;

  // Used to feature test Opera returning wrong values 
  // for documentElement.clientHeight. 
  function isDocumentElementHeightOff () { 
      var d = document,
          div = d.createElement('div');
      div.style.height = "2500px";
      d.body.insertBefore(div, d.body.firstChild);
      var r = d.documentElement.clientHeight > 2400;
      d.body.removeChild(div);
      return r;
  }

  if (typeof document.clientWidth == "number") {
     return function () {
       return { width: document.clientWidth, height: document.clientHeight };
     };
  } else if (IS_BODY_ACTING_ROOT || isDocumentElementHeightOff()) {
      var b = document.body;
      return function () {
        return { width: b.clientWidth, height: b.clientHeight };
      };
  } else {
      return function () {
        return { width: docEl.clientWidth, height: docEl.clientHeight };
      };
  }
})();

的注：尺寸无法准确确定后才文件加载完毕的

从 comp.lang.javascript常见问题

这篇关于获取可用的浏览器窗口大小（clientHeight / clientWidth）一直在多个浏览器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！