Ejemplo
Obtener la altura de la ventana y el ancho: (NOT including toolbars/scrollbars) :
var w = window.innerWidth;
var h = window.innerHeight;
Inténtalo tú mismo " Más "Try it Yourself" ejemplos a continuación.
Definición y Uso
La propiedad innerWidth devuelve el ancho interior del área de contenido de una ventana.
La propiedad innerHeight devuelve la altura interna del área de contenido de una ventana.
Estas propiedades son de sólo lectura.
Consejo: Utilice los outerWidth y outerHeight propiedades para obtener la anchura / altura con barras de herramientas / barras de desplazamiento.
Soporte del navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Propiedad | |||||
---|---|---|---|---|---|
innerWidth | 1.0 | 9.0 | 1.0 | 3.0 | 9.0 |
innerHeight | 1.0 | 9.0 | 1.0 | 3.0 | 9.0 |
Note: Para IE8 y anteriores, puede utilizar los ClientWidth y clientHeight propiedades (See "More Examples" below) .
Sintaxis
window.innerWidth
window.innerHeight
Detalles técnicos
Valor de retorno: | Un número, que representa la anchura interior y / o la altura interior del área de contenido de la ventana del navegador, en píxeles |
---|
Más ejemplos
Ejemplo
Una solución multi-navegador (usando clientWidth y clientHeight para IE8 y anteriores):
var w = window.innerWidth
|| document.documentElement.clientWidth
||
document.body.clientWidth;
var h = window.innerHeight
||
document.documentElement.clientHeight
|| document.body.clientHeight;
Inténtalo tú mismo " Ejemplo
Una demostración de innerWidth, innerHeight, outerWidth y outerHeight en un ejemplo:
var txt = "";
txt += "<p>innerWidth: " + window.innerWidth + "</p>";
txt +=
"<p>innerHeight: " + window.innerHeight + "</p>";
txt += "<p>outerWidth: " + window.outerWidth + "</p>";
txt += "<p>outerHeight:
" + window.outerHeight + "</p>";
Inténtalo tú mismo " <Ventana Object