Redimensionner l'iframe pour se contenter de Jquery

Il vous suffit d'appliquer votre code sur l'événement de load iframe, de sorte que la hauteur est déjà connue à ce moment-là, le code suit:

 $("#IframeId").load(function() { $(this).height( $(this).contents().find("body").height() ); }); 

Voir démo de travail. Cette démo fonctionne sur jsfiddle car j'ai défini l'URL de l'iframe dans une url dans le même domaine que l'iframe du résultat jsfiddle, c'est-à-dire le domaine fiddle.jshell.net .

MISE À JOUR :
@Youss: Il semble que votre page pour une raison étrange n'obtienne pas la taille du corps, alors essayez d'utiliser la hauteur des éléments principaux, comme ceci:

 $(document).ready(function() { $("#IframeId").load(function() { var h = $(this).contents().find("ul.jq-text").height(); h += $(this).contents().find("#form1").height(); $(this).height( h ); }); }); 

Je ne suis pas certain de savoir pourquoi la solution de Nelson ne fonctionnait pas dans Firefox 26 (Ubuntu), mais la solution Javascript-jQuery suivante semble fonctionner dans Chromium et Firefox.

 /** * Called to resize a given iframe. * * @param frame The iframe to resize. */ function resize( frame ) { var b = frame.contentWindow.document.body || frame.contentDocument.body, cHeight = $(b).height(); if( frame.oHeight !== cHeight ) { $(frame).height( 0 ); frame.style.height = 0; $(frame).height( cHeight ); frame.style.height = cHeight + "px"; frame.oHeight = cHeight; } // Call again to check whether the content height has changed. setTimeout( function() { resize( frame ); }, 250 ); } /** * Resizes all the iframe objects on the current page. This is called when * the page is loaded. For some reason using jQuery to trigger on loading * the iframe does not work in Firefox 26. */ window.onload = function() { var frame, frames = document.getElementsByTagName( 'iframe' ), i = frames.length - 1; while( i >= 0 ) { frame = frames[i]; frame.onload = resize( frame ); i -= 1; } }; 

Ceci redimensionne continuellement tous les iframes sur une page donnée.

Testé avec jQuery 1.10.2 .

L'utilisation de $('iframe').on( 'load', ... ne fonctionnerait que par intermittence. Notez que la taille doit d'abord être réglée sur 0 pixels de hauteur si elle doit se réduire en dessous de la hauteur d' iframe par défaut dans certains navigateurs.

Ce que vous pouvez faire, c'est ce qui suit:

• Dans l'iFrame, utilisez document.parent.setHeight (myheight) pour définir la taille dans iFrame vers le parent. Ce qui est permis car il s'agit d'un contrôle enfant. Appelez une fonction du parent.

• Dans le parent, vous créez une fonction setHeight (iframeheight) qui redimensionne l'iFrame.

Regarde aussi:
Comment puis-je implémenter l'accès URL de Cross Domain à partir d'un Iframe en utilisant Javascript?

Il suffit de le faire sur la balise HTML, fonctionne parfaitement

 $("#iframe").load(function() { $(this).height( $(this).contents().find("html").height() ); }); 

Ajustez la hauteur d'un iframe, sur la charge et le redimensionnement, en fonction de sa hauteur corporelle.

 var iFrameID = document.getElementById('iframe2'); var iframeWin = iFrameID.contentWindow; var eventList = ["load", "resize"]; for(event of eventList) { iframeWin.addEventListener(event, function(){ if(iFrameID) { var h = iframeWin.document.body.offsetHeight + "px"; if(iFrameID.height == h) { return false; } iFrameID.height = ""; iFrameID.height = iframeWin.document.body.offsetHeight + "px"; } }) }