iFrame Höhe dynamsich anpassen

D

DiDiJo

Erfahrenes Mitglied
Hi Leute,

ich habe eine Seite, die eine Subdomain per iFrame anbindet:
http://www.domain.de/intern.htm bindet per iframe http://www.intern.domain.de an.

auf der intern.domain.de/index.htm (Seite im iFrame) habe ich eine relativ kurze Ergebnisliste wo die Ergebnisse auf eine recht lange Detailseite (intern.domain.de/details.php?id=xyz) verlinken.

Nun würde ich gerne die Höhe des iFrames dynamisch ermitteln und den iFrame immer gleich der Content-Höhe + 25 Pixel groß machen. Ist der iFrame Content (body) 100 Pixel hoch, so soll der iFrame automatisch 125 Pixel groß sein.

Ich habe auch schon ein ähnliches Skript gefunden (http://css-tricks.com/cross-domain-iframe-resizing/) was auch teilweise funktioniert. Wenn ich aber auf eine Detailseite springe, greift das JQ Skript und der iFrame wird einfach resettet. Ich befinde mich also wieder auf der intern.domain.de/index.htm Seite.

Hat jemand von euch vlt ein Skript, das dynamisch die Höhe des iFrame errechnet und anpasst und das auch nach einen Seitenwechel noch funktioniert ?!


Mfg Daniel
 
Hi,

Sven Mintel hat hier mal ein Script vorgestellt, das die Höhe eines iFrames dynamisch an den Inhalt anpasst.

Voraussetzung für das Funktionieren ist, dass sie die beiden Dokumente unter der selben Domain befinden. Andernfalls ist der Zugriff nicht möglich, da sonst gegen die Sicherheitsrichtlinie der gleichen Herkunft (same origin policy) verstossen werden würde.

Ciao
Quaese
 
bevor ich jetzt über stunden versuche den artikel zu lesen und verstehen ... kannst du mir nicht einfach kurz sagen wie die htaccess anweisung lauten muss ?!
 
ahhhh hat sich erledigt ... ich habe eine gute Cross-Domain lösung gefunden:

main.de:
Code: 
<head>
<script type="text/javascript">

function resizeCrossDomainIframe(id, other_domain) {
	var iframe = document.getElementById(id);
	window.addEventListener('message', function(event) {
		//alert("yes frame ... i hear you ...");		
		if (event.origin !== other_domain) {
			//alert("i stop now 1");
			return; // only accept messages from the specified domain
		}
		if (isNaN(event.data)) {
			//alert("i stop now 2");
			return; // only accept something which can be parsed as a number
		}
		
		var height = parseInt(event.data) + 32; // add some extra height to avoid scrollbar		
		//alert("iFrame height: "+height);		
		iframe.height = height + "px";
	}, false);
}
</script>

</head>
<body>
<iframe src="http://www.sub.main.de" id="my_iframe" onload="resizeCrossDomainIframe(\'my_iframe\', \'http://www.sub.main.de\');" width="100%" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</body>


und hier noch der wichtige Part aus der sub.main.de
Code: 
<body onload="parent.postMessage(document.body.scrollHeight, 'http://www.main.de');">
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück