如何在IE，Firefox，Webkit中獲取javascript中的當前文檔區域大小？

Question

我需要跨瀏覽器兼容的Javascript代碼，它將返回所有三種瀏覽器（IE，Firefox，Webkit [Chrome/Safari]）中當前文檔區域的高度和寬度。我不需要整個窗口大小（因爲它在桌面上），而是與CSS佈局相關的文檔的高度和寬度。

感謝

Answer 1

我需要的其實是什麼要容易得多......

function getDocumentWidth() { 
    return document.documentElement.offsetWidth; 
} 

function getDocumentHeight() { 
    return document.documentElement.offsetHeight; 
} 

Answer 2

如何：

// Calc visible screen bounds (this code is common) 
var w = 0, h = 0; 
if (typeof(window.innerWidth) === 'number') {// не msie 
    w = window.innerWidth; 
    h = window.innerHeight; 
} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { 
    w = document.documentElement.clientWidth; 
    h = document.documentElement.clientHeight; 
} 
var sx = 0, sy = 0; 
if (typeof window.pageYOffset === 'number') { 
    sx = window.pageXOffset; 
    sy = window.pageYOffset; 
} else if (document.body && (document.body.scrollLeft || document.body.scrollTop)) { 
    sx = document.body.scrollLeft; 
    sy = document.body.scrollTop; 
} else if (document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop)) { 
    sx = document.documentElement.scrollLeft; 
    sy = document.documentElement.scrollTop; 
} 
var winHeight = h + sy; 
var winWidth = w + sx; 

Answer 3

了我的頭頂，將獲得工體的高度？用jQuery像

$("body").css("height") 

UPDATE：假設你正在使用jQuery（你爲什麼不;-)），然後this post回答使用上述解決方案時添加以下內容到你的CSS問題。

head { height: 100%; } 
body { min-height: 100%; } 

這也應該工作

$(window).height() 

這將包括利潤率不過，如果你得到更多的高度比你認爲你應該。

Answer 4

這是從其他網站，我忘了實際，但是，所有功勞歸於誰它屬於，而不是我。那就是：

function f_clientWidth() 
     { 
      return f_filterResults(
         window.innerWidth ? window.innerWidth : 0, 
         document.documentElement ? document.documentElement.clientWidth : 0, 
         document.body ? document.body.clientWidth : 0 
        ); 
     } 

     function f_clientHeight() 
     { 
      return f_filterResults 
        (
         window.innerHeight ? window.innerHeight : 0, 
         document.documentElement ? document.documentElement.clientHeight : 0, 
         document.body ? document.body.clientHeight : 0 
        ); 
     } 

     function f_scrollLeft() 
     { 
      return f_filterResults 
        (
         window.pageXOffset ? window.pageXOffset : 0, 
         document.documentElement ? document.documentElement.scrollLeft : 0, 
         document.body ? document.body.scrollLeft : 0 
        ); 
     } 

     function f_scrollTop() 
     { 
      return f_filterResults 
        (
         window.pageYOffset ? window.pageYOffset : 0, 
         document.documentElement ? document.documentElement.scrollTop : 0, 
         document.body ? document.body.scrollTop : 0 
        ); 
     } 

     function f_filterResults(n_win, n_docel, n_body) 
     { 
      var n_result = n_win ? n_win : 0; 

      if(n_docel && (!n_result || (n_result > n_docel))) 
      { 
       n_result = n_docel; 
      } 

      return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result; 
     } 

用法很簡單：

對於寬度，請致電：f_clientWidth（），等等...