¿Cómo obtengo el tamaño de la ventana del navegador usando Prototype.js?

Question

¿Cómo obtengo el tamaño de la ventana del navegador usando la versión 1.6.0.3 de Prototype.js?

Answer 1

Esta es mi solución que da los mismos valores que la barra de herramientas Web Developer en Firefox.

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; 
    } 
}); 

Answer 2

De acuerdo con la API de prototipo 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 

Answer 3

Y la misma idea, pero más compacto:

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) 
}); 

Answer 4

Esto funciona en todos los navegadores modernos y IE6 +:

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

se requiere un tipo de documento correcto