Ajuster la hauteur d’iFrame en fonction de son contenu en JavaScript

Vous pouvez utiliser la propriété contentWindow de JavaScript pour obliger « iFrame » à ajuster automatiquement sa hauteur en fonction du contenu qu’elle contient, de sorte qu’aucune barre de défilement verticale n’apparaisse. Voici un exemple:
 
 

Code source :
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Ajuster la hauteur d'iFrame en fonction de son contenu</title>
		<style>
			iframe{
				width: 100%;
				border: 1px solid #000;
			}
		</style>
	</head>
	<body>
	   <iframe src="contact.php" frameborder="0" scrolling="no" onload="adjustIframe(this)" />
		<script>
		  function adjustIframe(obj) {
			obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
		  }
		</script>
	</body>
</html>
Remarque : Cela ne fonctionnera pas si l’iframe contient du contenu provenant d’un autre domaine.
QCM Javascript

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *