Modificar a altura (height) de um elemento HTML

Junho 2017

Modificar a altura (height) de um elemento HTML


Para modificar a altura de um elemento HTML em javascript, basta utilizar sua propriedade de estilo "height".

Para tanto você pode fazer aí referência da seguinte maneira:

Se você desejar conhecer a altura (height) de um bloco HTML, existe duas maneiras de acordo com os navegadores:
  • element.offsetHeight
  • element.style.pixelHeight



Assim o seguinte código permite obter a altura de um bloco HTML de qualquer navegador:
var height = document.getElementById('id_element').style.height;

Note que se você quiser modificar esta propriedade, basta especificar « px ».
Assim, o seguinte código permite obter a altura de um bloco HTML de acordo com o navegador:

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


S você recuperar dinamicamente o valor da altura, você deve então concatenar « px » a este valor :

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


Veja também

Artigo original publicado por . Tradução feita por ninha25. Última modificação: 30 de abril de 2010 às 07:59 por ninha25.
Este documento, intitulado 'Modificar a altura (height) de um elemento HTML', está disponível sob a licença Creative Commons. Você pode copiar e/ou modificar o conteúdo desta página com base nas condições estipuladas pela licença. Não se esqueça de creditar o CCM (br.ccm.net) ao utilizar este artigo.