Regístrate para
recibir el boletín de
e-Contento.com. Ya somos 4356 suscriptores. [+]

Listado de Artículos  
 Alto y ancho del navegador.
En este artículo muestro un par de funciones JavaScript para calcular la altura y anchura de la ventana del navegador, sin bordes, menús, barra de estado o scrolls. La finalidad de estas dos funciones es calcular las dimensiones de la parte "útil" de la ventana.
Añadir a Gennio Añadir a del.icio.us Añadir a Digg Añadir a Meneame Añadir a Technorati Suscribir a Bloglines Suscribir a Netvibes Suscribir a Google Suscribir a Windows Live Suscribir a Mi Yahoo! Sindicación RSS. Feed
Recientemente, me preguntaron que cómo se calculaba el "Ancho" y "Alto" útiles del navegador. No supe responder.

Lo cierto, es que es una de esas tareas rutinarias, que aparecen de cuando en cuando, y te amargan la existencia durante un par de días, hasta que resuelves el problema. Luego, cuando menos te lo esperas, vuleve a surgir el problema, que suele coincidir con el momento en que te das cuenta que se te ha olvidado cómo lo resolviste la última vez...

Bueno, pues ahí van las dos funciones que solucionan ese problemilla. (Ya no se me olvidarán nunca más...)

// Archivo Dimensiones Ventana
// Dos funciones que calculan el alto y el
// ancho de la parte util del navegador
// Fecha: 2001 04 17

// Copyright (C) 2001 Juan Antonio Jiménez
// Distribuido bajo los términos de
// GNU Library General Public License
// Disponible en http://e-Contento.com/

function calculaAlto(){
  if (document.layers){
    alto = window.innerHeight;
  } else {
    alto = document.body.clientHeight;
  }
  return alto;
}

function calculaAncho(){
  if (document.layers){
    ancho = window.innerWidth;
  } else {
    ancho = document.body.clientWidth;
  }
  return ancho;
}



Para el Netscape es fácil y es rápido encontrarlo en la documentación, pero os aseguro que en el explorer nunca se te ocurriría que el ancho y el alto se obtienen consultando una propiedad del objeto body. Se te podría ocurrir que es algo propio de "window" o de "navigator", pero no. Es de "body"...

Esto tiene un inconveniente. Y es que estas propiedades se obtienen en el momento de la carga de la página y luego permanecen invariables. Es decir, que si redimensionas la ventana y consultas cuanto vale "alto" y "ancho", descubres con sorpresa que siguen valiendo lo mismo que antes.

La solución sería que cada vez que detectemos que hay un cambio de tamaño(resize) de la ventana, forcemos un reLoad(). Lo cual es un poco engorroso, puesto que no existe el controlador de eventos "onResize".

Aprovecho, para dar las gracias a Juan Luis, por soplarmelo para el Internet Explorer.

Juan Antonio Jiménez


volver
 RECOMENDAMOS
Madroñosfera
fotoMadrid
Sokoban en JavaScript
Directorio e-Contento

 MIS FOTOS...

 CITA
Cuando apuntas con un dedo, recuerda que los otros tres dedos te señanalan a tí. Proverbio Inglés

El que no sabe por qué camino llegará al mar, debe buscar el río por compañero. John Ray (1627-1705); naturalista inglés



Mi ICQ es 44428945 contento@mixmail.com Visita mi otra web: www.fotoMadrid.com - fotografías, wallpapers y postales de Madrid