[TYPO3-german] OT - Höhe eines iframes in Abhängigkeit vom Inhalt mittels jquery anpassen

Kay Strobach typo3 at kay-strobach.de
Thu Sep 20 15:29:23 CEST 2012


Hi Johannes,

ich poste mal aus meinem Wiki :)

== Povert ==

* Example: http://povert.com/fun/iframe/
* Source:
http://www.povert.com/2008/05/19/dynamic-resizing-of-cross-domain-iframes/
* Idea:    see below

<source lang="plain">
.
+--------------------------------------------------------------------------------+
   |Domain 1 Frame
            |

|--------------------------------------------------------------------------------|
   |
            |
   |
+---------------------------------------------------------------------+
    |
   |    |Domain 2 Frame
      |     |
   |
|---------------------------------------------------------------------|
    |
   |    |Contains a script, to create the proxy frame, can be loaded
from host|     |
   |    |
      |     |
   |    |
+-------------------------------------------------------------+   |     |
   |    |   |Domain 1 Frame # height and width in uri
  |   |     |
   |    |
|-------------------------------------------------------------|   |     |
   |    |   |
  |   |     |
   |    |   |send signal to parent.parent and resize the frame :D
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |   |
  |   |     |
   |    |
+-------------------------------------------------------------+   |     |
   |    |
      |     |
   |
+---------------------------------------------------------------------+
    |
   |
            |

+--------------------------------------------------------------------------------+

</source>

== Microsoft ==

* Source:  http://support.microsoft.com/kb/278469
* Idea:    see below

<source lang="html">
<HTML>
<HEAD>
<SCRIPT LANGUAGE=javascript>
<!--
function reSize()
{
	try{	
	var oBody	=	ifrm.document.body;
	var oFrame	=	document.all("ifrm");
		
	oFrame.style.height = oBody.scrollHeight + (oBody.offsetHeight -
oBody.clientHeight);
	oFrame.style.width = oBody.scrollWidth + (oBody.offsetWidth -
oBody.clientWidth);
	}
	//An error is raised if the IFrame domain != its container's domain
	catch(e)
	{
	window.status =	'Error: ' + e.number + '; ' + e.description;
	}
}
//-->
</SCRIPT>
</HEAD>
<BODY onload=reSize()>
	<iframe onresize=reSize() id=ifrm src=YOUR_PAGE_HERE></iframe>
</BODY>
</HTML>
</source>

Am 20.09.2012 12:40, schrieb JCL - Johannes C. Laxander:
> Hallo,
>  
> ich möchte in einer TYPO3-Seite den Inhalt einer externen Seite in einen iFrame laden. Dazu habe ich ein HTML Inhaltselement angelegt und dort den HTML-Code für den iFrame hinterlegt. Das funktioniert soweit auch, nur wird die Höhe nicht dem Inhalt automatisch angepasst.
>  
> Nach vielem googlen und vielen Beispieln die ich mir angesehen habe, schien mir die Verwendung eines Plugins am Einfachsten: https://github.com/house9/jquery-iframe-auto-height. Nach dieser Anleitung habe bin dann auch vorgegangen und habe eine einfache Testseite angelegt: http://khpy.webseiten.cc/news-test.html. Diese Seite definiert den iFrame und bindet die jQuery-Lib und das jQuery-Plugin ein. Über eine Funktionsaufruf sollte die Höhe meines iFrames neu berechnet  werden:
>  
> $(document).ready(function () {
>    $('iframe#anm-news-z109').iframeAutoHeight({debug: true});  
> });
> 
> Eigentlich simpel. Und trotzdem tuts nicht! Hab ich irgendeas übersehen? 
>  
> Wer kann mir hier bitte weiterhelfen?
>  
> Gruß, Johannes.
> 


-- 
http://www.kay-strobach.de - Open Source Rocks

TYPO3 .... inspiring people to share!
Get involved: http://typo3.org

Answer was useful - feel free to donate:
  -
https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=KPM9NAV73VDF2
  - https://flattr.com/profile/kaystrobach



More information about the TYPO3-german mailing list