Javascript - Modifier la hauteur (height) d'un élément HTML

Dernière mise à jour le 20 novembre 2009 à 18:25 par Jeff
Publié par Jeff
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, 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 :
var height = document.getElementById('id_element').style.height;

Notez que si vous voulez modifier cette propriété, il faut spécifier "px".
Ainsi, le code suivant permet d'obtenir la hauteur d'un bloc HTML selon le navigateur :

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


Si vous récupérez dynamiquement la valeur de la hauteur, vous devez donc concaténer "px" à cette valeur :
<script type="text/javascript">
<!--
var obj = document.getElementById('id_element');
obj.style.height = height+"px";
//-->
</script>
Meilleures réponses pour « Javascript Modifier la hauteur (height) d'un élément HTML » dans :
Javascript - Connaître la hauteur d'un élément HTML Voir 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...
[Firefox] Personnaliser les pages web avec Greasemonkey VoirC'est quoi, GreaseMonkey ? Exemple 1 Exemple 2 XPath Fonctions utilitaires removeElement() removeAttributeOfElement() setAttributeOfElement() injectCSS() Exemple 3 Liens C'est quoi, GreaseMonkey ? GreaseMonkey est une extension...
Javascript - Les événements VoirQu'appelle-t-on un événement? Les événements sont des actions de l'utilisateur, qui vont pouvoir donner lieu à une interactivité. L'événement par excellence est le clic de souris, car c'est le seul que le HTML gère. Grâce au Javascript il est...
Javascript - Les tableaux VoirIntroduction à la notion de tableau Les variables de Javascript ne permettent de stocker qu'une seule donnée à la fois. Or, étant donné qu'il est souvent utile de manipuler de nombreuses données, le concept de variable se révéle parfois...
Javascript - les boîtes de dialogue VoirQu'est-ce qu'une boîte de dialogue? Une boîte de dialogue est une fenêtre qui s'affiche au premier plan suite à un événement, et qui permet Soit d'avertir l'utilisateur Soit le confronter à un choix Soit lui demander de compléter un champ pour...
Collection CommentÇaMarche.net