Javascript – Modificar la altura (height) de un elemento HTML

última actualización el 6 de abril de 2009, 03:22 por Carlos-vialfa
Publicado por Carlos-vialfa
La propiedad de estilo “height” puede ser usada para modificar la altura de un elemento HTML en javascript. Para ello puedes hacer lo siguiente:

Si deseas conocer la altura (height) de un bloque HTML, existen dos métodos dependiendo del navegador:
  • element.offsetHeight
  • element.style.pixelHeight


Otro método de conocer la altura de un bloque HTML pero sin importar el navegador es:
var height = document.getElementById('id_element').style.height;

Si deseas modificar esta propiedad, deberás especificar “px”.
El siguiente código permite obtener la altura de un bloque HTML dependiendo del navegador:

<script type="text/javascript">
<!--
var obj = document.getElementById('id_element');
obj.style.height = "502px";
//-->
</script>


Si deseas recuperar dinámicamente el valor de la altura, deberás añadir “px” a este valor:

<script type="text/javascript">
<!--
var obj = document.getElementById('id_element');
obj.style.height = height+"px";
//-->
</script>


PD: El artículo original fue escrito por Jeff, contribuidor de CommentCaMarche
Mejores respuestas para « Javascript – Modificar la altura (height) de un elemento HTML » en :
Javascript – Conocer la altura de un elemento HTML Ver Si deseas determinar la altura (height) de un bloque HTML en javascript, existen dos métodos para hacerlo dependiendo del navegador: element.offsetHeight element.style.pixelHeight Existe tambien otro método que permite determinar la altura de...
Javascript – Centrar verticalmente una página Web Ver Javascript – Centrar verticalmente una página Web Tratar de centrar verticalmente una página Web con CSS es una perdida de tiempo. La solución más práctica consiste en utilizar JavaScript. 1. El archivo .js 2. La página .html 3. Uso 4....
Javascript – Borrar el campo de un formulario al hacerle clic Ver Javascript – Borrar el campo de un formulario al hacerle clic Seguramente ya te has encontrado con formularios HTML rellenados con texto indicando el tipo de dato esperado. Aunque esto puede ser útil en algunas circunstancias, en otras puede ser...
Javascript – La función split() VerJavascript – La función split() La función split() permite dividir una cadena de caracteres (string) en varios bloques y crear un array con estos, en función de un elemento indicador del split. En el siguiente ejemplo, la función split() permite...
[Javascript] Fecha de la última modificación de la página VerEn Javascript es posible mostrar la fecha de la última modificación de la página web gracias a la propiedad lastModified del objeto document:
Descargar PHP Editor VerPHP Editor es una herramienta perfecta para los programadores en lenguaje PHP, además puede ser utilizado para HTML, SQL, Java, JavaScript, C++, Python, etc. Con PHP Editor podrás trabajar con varios documentos al mismo tiempo, éste incorpora un...
Descargar HTML Tidy VerHTML Tidy es un programa que corrige y edita todo codigo HTML y posee una interfaz visual. Logra detectar y corregir; adiciona la barra “/” si no lo escribió, posiciona correctamente el “hr”, ordena tags mixtos, en general HTML Tidy optimiza tu...
Administración de imágenes en HTML Ver¿Cómo mostrar imágenes en una página Web? Tener algunas imágenes en un sitio Web lo hace más atractivo e intuitivo. Sin embargo, es importante no excederse ya que las imágenes pueden llevar mucho tiempo en cargarse y, en algunos casos, pueden hacer...
Hipervínculos VerIntroducción a los anclajes Los vínculos de hipertexto o hipervínculos (anclajes) son elementos de una página HTML que, al hacer clic sobre ellos, permiten a los lectores navegar hacia una nueva dirección. (el hipervínculo aparece subrayado de forma...
Listas en HTML VerListas Una lista es un párrafo estructurado que contiene una serie de elementos. HTML define tres tipos de listas: Listas ordenadas; Listas no ordenadas; Listas de definiciones. Lista ordenada Contenedor Tipo de lista Efecto...