Cross Browser – JavaScript zur Iframe-Höhenanpassung
Vor einigen Wochen bekam ich den Auftrag eine Forensoftware in ein Internet-Portal einzubetten. Dies geschieht sinnvollerweise mit einem Iframe.
Nun eigentlich kein Problem, aber der Teufel steckt im Detail …
Automatische Breitenanpassung ist einfach: Der iFrame bekommt das Attrribut ‘width=”100%”‘
Die Anpassung der Höhe ist aber schwieriger. Man muss bedenken, dass sich die Höhe des Fensters bei der Arbeit mit der im Iframe eingebetteten Applikation permanent ändert. Bei einem Forum : Die Fensterhöhe der Forenübersicht wird sicher unterschiedlich zur Ansicht eines beliebigen Artikels sein. Und bei verschiedenen Artikeln ist die Höhe sicher auch jedesmal anders.
Eine Antwort darauf ist die Angabe eine festen Höhe im Iframe. Also zum Beispiel mit ‘height=”500px”‘. Passt diese Größe nicht, dann werden durch die Default-Voreinstellung ’scrolling=”auto”‘ automatisch Scrollbars (Bildlaufleisten in deutsch) erzeugt. Schön ist etwas anderes 
…
Was also tun ? Die andere Antwort ist ein JavaScript-Event an den Iframe zu “hängen”. Dieser wird bei jeder Größenänderung des eingebetteten Applikations aktiviert und kann dazu benutzt werden, die Größe des Iframes entsprechend zu ändern.
Klingt doch gut, nicht wahr ? Leider ist es nicht so ganz einfach, weil das Document Object Model (DOM) des Iframes auf jedem Browser anders ist. (DOM : damit kann man jedes Element einer HTML-Seite von z.B. JavaScript adressieren und ändern; z.B. auch die Höhe des Iframes)
Nun nachdem ich durch diese Hölle der Inkompatibilitäten gegangen bin, ist ein Script entstanden, das ich mit der Welt teilen möchte. Hoffe damit einigen Web-Entwicklern dieser Welt einige graue Haare zu ersparen …
