Javascript - Connaître la hauteur d'un élément HTML

Si vous souhaitez connaître la hauteur (height) d'un bloc HTML en javascript, il existe deux façons selon les navigateurs :
  • element.offsetHeight
  • element.style.pixelHeight



Ainsi, le code suivant permet d'obtenir la hauteur d'un bloc HTML quel que soit le navigateur :

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

if(obj.offsetHeight)          {divHeight=obj.offsetHeight;}
else if(obj.style.pixelHeight){divHeight=obj.style.pixelHeight;}
//-->
</script>
Publié par Jeff - Dernière mise à jour le 20 novembre 2009 à 18:25 par Jeff
Ce document intitulé « Javascript - Connaître la hauteur d'un élément HTML » issu de CommentCaMarche (www.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Suggestions
  •  Javascript - Connaître la hauteur d'un élément HTML
  •  Modifier la hauteur (height) d'un élément HTML » Fiches pratiques : Pour modifier la hauteur d'un élément HTML en javascript, il suffit d'utiliser sa propriété de style "height". Pour cela vous pouvez y faire référence de la manière suivante : Si vous souhaitez connaître la hauteur (height) d'un bloc HTML,...
  •  [JS] Insertion d'éléments HTML en JavaScript (Résolu) » Meilleure réponse: Le 1er paramètre de getElementById n'est pas un sélecteur CSS, tu confonds un peu le JS traditionnel et JQuery :) Donc sans le '#', ça ira mieux.
  •  [Javascript] Ajouter/Remplacer un élément » Meilleure réponse: Bonsoir, pas bien compris, mais pour écrire en javascript dans une partie de ta page: - dans ta page à l'endroit où tu veux écrire, tu mets <div id="id_div1"></div> et en dans le javascript:...
  •  Activer/ desactiver bouton en javascript » Meilleure réponse: bon ok, je fais un nouveau test, je repars du début : toujours la même attente mais simplifié : Activé le bouton ok seulement si un radio est coché, voilà mon code si ça vous parle... <html> <title>test </title> <body> <FORM name="mafor
  •  [html] cacher ou afficher des éléments (Résolu) » Meilleure réponse: Il faut faire ça en javascript. Tu mets ton texte dans une div de cette façon : <div id="id_div_1" style="display:none;"> Texte à masquer, afficher </div> Et sur ton lien a href="" onclick="javascript:visibilite('id_div'_1); return fals
Dossier à la une
Passage au tout numérique : quel coût pour les particuliers ?
Librairies Javascript (Prototype/Scriptaculous/Yahoo UI, etc.)
Modifier la hauteur (height) d'un élément HTML