Iframe à la taille de son contenu

J’ai eu besoin cette semaine de pouvoir redimensionner automatiquement une iframe selon la taille de son contenu…

Comment faire ? Simple… Avec un petit javascript.

Il suffit de mettre le code javascript suivant dans le head de votre page

<script language="JavaScript">
<!--
function calcHeight()
{
  //récupère la hauteur de la page
  var the_height=
    document.getElementById('the_iframe').contentWindow.
      document.body.scrollHeight;</p>
<p>  //change la hauteur de l'iframe
  document.getElementById('the_iframe').height=
      the_height;
}
//-->
</script

puis de créer votre iframe dans le body de votre page comme ceci:

<iframe width="700" id="the_iframe"<br />
	onLoad="calcHeight();"<br />
	src="testing_page.shtml"<br />
	scrolling="NO"<br />
	frameborder="1"<br />
	height="1"><br />
ici un petit texte visible uniquement<br />
des navigateurs qui ne supportent pas<br />
les iframes<br />
</iframe>

Et voilà ! Ca peut dépanner !