2009-05-07 24 views

答えて

4

これは、FirefoxでWeb Developerツールバーと同じ値を与える私の解決策です。

var WindowSize = Class.create({ 
    width: function() 
    { 
     var myWidth = 0; 
     if (typeof(window.innerWidth) == 'number') 
     { 
      //Non-IE 
      myWidth = window.innerWidth; 
     } 
     else if (document.documentElement && document.documentElement.clientWidth) 
     { 
      //IE 6+ in 'standards compliant mode' 
      myWidth = document.documentElement.clientWidth; 
     } 
     else if (document.body && document.body.clientWidth) 
     { 
      //IE 4 compatible 
      myWidth = document.body.clientWidth; 
     } 
     return myWidth; 
    }, 
    height: function() 
    { 
     var myHeight = 0; 
     if (typeof(window.innerHeight) == 'number') 
     { 
      //Non-IE 
      myHeight = window.innerHeight; 
     } 
     else if (document.documentElement && document.documentElement.clientHeight) 
     { 
      //IE 6+ in 'standards compliant mode' 
      myHeight = document.documentElement.clientHeight; 
     } 
     else if (document.body && document.body.clientHeight) 
     { 
      //IE 4 compatible 
      myHeight = document.body.clientHeight; 
     } 
     return myHeight; 
    } 
}); 
21

プロトタイプAPI documentationによると:

var viewport = document.viewport.getDimensions(); // Gets the viewport as an object literal 
var width = viewport.width; // Usable window width 
var height = viewport.height; // Usable window height 
+0

幅が異なるが必要です

var w = document.documentElement.clientWidth; var h = document.documentElement.clientHeight; 

私がJavascriptを使って得たものと、FirefoxのWeb Developerツールバーの値を比較します。それは私のこれで十分に近いです – DaveC

+0

heigthは常に私のために0です – grosser

8

と同じ考えが、よりコンパクト:

var WindowSize = Class.create({ 
    width: window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth), 
    height: window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight) 
}); 
2

これは、すべての近代的なブラウザとIE6 +上で動作します:正しい文書型が

関連する問題