Hinweis:
Diese Website ref.thorstn.com wird nicht weiter aktualisiert. Die hier vorliegende Version der Webpräsenz wird nicht mehr mit dem CMS realisiert, sondern mittels HTML-Dateien als Archiv dargestellt. Datum: 7.1.2021

Höhe eines iframe automatisch anpassen

Einfache HTML-Seite (Lorem Ipsum... Text) via iframe eingebunden.
Hierbei wird die eingebundene Seite automatisch in der Höhe erkannt, sodass für das iframe in der Inhaltsseite keine Höhenangabe zu machen ist.
Im vorliegenden Beispiel habe ich der eingebundenen Seite "lorem.htm" eine feste Breite von 480 Pixel, die Schriftart Arial in Schriftfarbe grau sowie einen transparenten Hintergrund gegeben. Die eingebundene Seite habe ich in den neu erstellten Ordner "texte" innerhalb der moziloCMS Instanz gelegt.

Folgende Schritte sind hierzu nötig:

Innerhalb der einzubindenden Seite wird am Anfang des <body> Abschnittes folgendes eingetragen:

<body style="background-color:transparent;font-family:arial;font-size:12px;color:#5c5c5c;" onload="parent.document.getElementById('hoehe').style.height=(document.getElementById('iframed').offsetHeight)+20 +'px'">

<div id="iframed" style="width:480px;background-color:transparent;">

Den ID-Namen iframed habe ich frei gewählt. Die rot markierten Bereiche zeigen an, wo der ID-Name eingetragen werden muss.

In die Inhaltsseite, welche die eingebundene Seite (mit automatischer Höhenanpassung) anzeigen soll, wird folgendes notiert:

[html|<iframe id="hoehe" frameborder="0" width="480" scrolling="no" src="../texte/lorem.htm"></iframe>]