La problématique est la suivante : comment connaitre la hauteur d’un élément d’une page web alors que son contenu est dynamique et sa mise en page variable d’un navigateur/système à l’autre ?

Voici une solution pour calculer la hauteur d’un élément dans une page web au travers d’un Javascript :

La fonction suivante permet de calculer la hauteur de ou des élément situés entre deux balises div identifiées par les id debut et fin

<script type=”text/javascript”>
<!–
function getHeight() {
var d = document.getElementById(“debut”).offsetTop;
var f = document.getElementById(“fin”).offsetTop;
return f-d;
} //–>
</script>

L’élément est ensuite intégré entre deux balises :

<DIV id=”debut”></DIV>
<!– On met les éléments ici –>
<DIV id=”fin”><DIV>

Il suffira ensuite d’appeler la fonction getHeight() pour récupérer la hauteur de l’élément dans le navigateur…

Ce système à l’avantage de fonctionner sur IE 6.0, Mozilla 1.7.3, Firefox 1.0 et Firefox 1.0.2