JavaScript - Die Höhe eines IFrames responsiv dem Inhalt anpassen

Dieses JavaScript passt autom. die Höhe des IFrames an dessen Inhalt an. Sehr nützlich wenn man den gesamten Inhalt anzeigen und Scrollleisten vermeiden möchte.

<iframe src="inhalt.htm" style="width: 95%"></iframe>

Datei: inhalt.htm

<html lang="de">
 <head>
  <title>Test</title>

<script>
window.addEventListener("load", fenster);
window.addEventListener("resize", fenster);

function fenster() {
 if (parent.document.getElementsByTagName("iframe")[0]) {
  parent.document.getElementsByTagName("iframe")[0].style.height =
   document.getElementsByTagName("html")[0].offsetHeight +'px';
 }
}
</script>

 </head>
<body>

Lorem ipsum …

Demo

Beispiel mit einer ID

Wenn man den Inhalt an ein bestimmtes IFrame richten möchte, dann geht das am besten mit einer ID.

<script>

window.addEventListener("load"fenster);
window.addEventListener("resize"fenster);

function 
fenster() {
 if (
parent.document.getElementById("eineID")) {
  
parent.document.getElementById("eineID").style.height =
   
document.getElementsByTagName("html")[0].offsetHeight +'px';
 }
}
</
script>
<iframe src="inhalt.htm" id="eineID" style="width: 95%"></iframe>

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<ins> Logische Auszeichnung

CSS - Lightbox

PHP - Letztes Verzeichnis aus einer URL ermitteln

JavaScript - Die Position eines Schiebereglers speichern und auslesen

MySQL - Mit mehreren Begriffen gleichzeitig suchen

Zu lange Tabellen
Vermeiden Sie lange Tabellen. diese haben den Nachteil, dass die Kommunikation zwischen Server und Client (Ihnen) erheblich erhöht werden muss, was sich auf die Ladezeiten ebenso erheblich auswirkt. Denn der Inhalt einer Tabelle wird immer erst dann angezeigt, wenn diese vollständig geladen wurde. Unterbrechen Sie Tabellen daher immer an mehreren Stellen, um sie im Anschluss wieder weiterzuführen. So erscheint der Seiteninhalt optimaler Weise Stück für Stück und der 15 sekündige Totalausfall (weißer Bildschirm) bleibt dem Besucher erspart.