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 JavascriptQCM Javascript – Partie 1QCM sur Javascript avec des réponses pour la préparation des tests techniques, des tests en ligne, aux examens et aux certifications. Ces questions et réponses…Lire plus

Laisser un commentaire

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