Iframe mit JS

H

hedo

Grünschnabel
Hallo,
leider benötige ich Eure Hilfe. Alles Googeln hat mir kein bracubares Ergebnis gebracht.
Folgendes Problem zum iframe beim Validieren auf Validome.org:
die Funktion "onload" darf nicht im iframe stehen.
Der Code für den iframe sieht so aus:
<iframe id="mainContent" name="mainContent" onload="resizeMe(this)"
src="aktuell.htm" width="100%" scrolling="no" marginwidth="0"
marginheight="0" frameborder="0></iframe>

Dazu gehört noch das folgene JS:
<script type="text/javascript">
// Dynamic Iframe loader
function loadIframe(theURL) {
document.getElementById("mainContent").src=theURL;
}

// resizes Iframe according to content

function resizeMe(obj){
docHeight = mainContent.document.height || mainContent.document.body.scrollHeight
obj.style.height = docHeight + 'px'
}
</script>
Das JS stammt von:
http://forum.jswelt.de/javascript/39342-iframe-height-anpassen-f-r-alle-browser.html
Meine Fragen zu der Sache:
1. Wie kann ich die Fehlerstelle korrigieren?
<iframe id="mainContent" name="mainContent" onload="resizeMe(this)"
2. Das Js läuft nur, wenn es so wie dargestellt im kopf der Seite steht. Versuche ich das Script als Datei (frame.js) aufzurufen, dann funktioniert die Sache nicht.

Ich habe mich deshalb für diese Lösung entschieden, weil meine iFrames alle sehr verschiedene Höhen haben. Diese Lösung funktioniert mit allen gängigen Browsern.
Schon jetzt besten Dank für Eure Hilfe
Klaus
 
Hi,

in Anlehnung an http://www.doktormolle.de/temp/iframe_resize2/ könntest du den onload-Event in das <body>-Element der Seiten auslagern, die in dem iFrame geladen werden.

HTML: 
<body onload="parent.resizeMe('mainContent')">


Svens Script funktioniert hier gleichermaßen, wenn es als externe js-Datei eingebunden wird.

Hast du beim Auslagern des Script-Codes evtl. den <script>...</script>-Tag mit in die js-Datei übernommen?

Dies wäre eine mögliche Ursache, dass das Script seinen Dienst verweigert.

Und der Pfad zur js-Datei ist korrekt benannt?

mfg Maik
 
Herzlichen Dank für die schnelle Antwort.
Habe esprobiert, leider ohne Erfolg. Die iFrames werden nicht in voller Höhe dargestellt, also die Höhenanpassung wird nicht aktiv.
Morgen werde ich weiter versuchen.
Klaus
 
Und was hindert dich, stattdessen auf Svens Script umzusatteln?

Wie gesagt, damit werden deine beiden genannten Problemstellungen tadellos gelöst :)

mfg Maik
 
Hallo Maik,
daran habe ich auch schon gedacht. Auf alle Fälle werde ich es versuchen. Gegen das Script spricht nichts. Es sieht auch alles sehr übersichtlich aus.
Bin gespannt, was dabei herauskommt.
Klaus
 
Hallo und einen schönen Wochenausklang,
ich bin wieder beim "Experimentieren", bis jetzt aber kein Erfolg.
Ich galaube, dass noch einige Erklärungen noch nötig sind.
Die Datei im iFrame enthält Nachrichten (zu jeder Nachricht ein Link).
Der Inhalt der Nachricht, also der Text, erscheint nach dem Anklicken in gleichen iFrame.
Allerdings sind die Texte im Umfang sehr verschieden, manche nur wenige Zeilen lang andere dagegen 20-30 Zeilen.
Deshalb muss der iframe immer in der Größe angepasst werden.
Das 2. Problem gelöst, den </script>Tag übersehen. geändert und funktioniert.
Herzliche Grüße
Klaus
 
Zuletzt bearbeitet:
Die Erklärung war eigentlich nicht vonnöten, denn das Motiv für die dynamische iFrame-Höhe kann man deinem ersten Beitrag entnehmen.

Und genau das setzt Svens Script http://www.doktormolle.de/temp/iframe_resize2/ unter Berücksichtigung deiner beiden vorgetragenen Probleme (onload-Event, externe JS-Datei) um - klickst du hierzu einfach mal auf die drei Verweise oberhalb des iFrames.

mfg Maik
 
Danke Maik,
das Problem besteht in der Fenstergröße. Ich bekomme es einfach nicht hin, dass sich der iFrame in Breite und Höhe anpasst.
Es entsteht nur ein kleines Fenster wie im Original.
Ober muss ich in jeder aufgerufenen Seite Breite und Höhe angeben?
Klaus
 
Moin,

es lässt sich nur schwer sagen, warum es nicht geht, wenn man nicht weiss, was genau du machst.

Ein Link zu deiner Seite wäre daher hilfreich.

Breite und Höhe musst du nicht angeben.
Du musst in der Elternseite die Funktion resizeMe() notieren, und natürlich das <iframe>, welches ein name-Attribut benötigt(im Beispiel ist es content)

In der Seite, die im <iframe> erscheint, musst du beim onload folgendes aufrufen:
Code: 
parent.resize_me('content')
...wobei das Argument, das übergeben wird(content) identisch sein muss mit dem name-Attribut des <iframe>-Elements im Elterndokument.
 
Hallo und danke für die Hilfe.
Mit Eurer Hilfe habe ich es so gut wie geschafft. Das Script von Doktormolle genommen und in die aufzurufende iFrame-Seite die onload-Funktion eingefügt. Im iFrame selbst noch die Seitenbreite mit 100% angegeben und es läuft. Nur ohne Angabe der Breite kommt nur ein schmaler IFrame heraus.
Auch Validome.org findet jetzt keinen Fehler mehr.
Leider ist "meine" neue Seite noch nicht online. Ich bin erst am Anfang alles neu zu erstellen.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück