Iframe : hauteur automatique

Version imprimable

Bonjour.

Je n'arrive pas à redimensionner mon iframe en fonction de son contenu.
Pourtant ce n'est pas faute d'avoir chercher...

Actuellement j'ai trouvé une méthode qui fonctionne en Safari, en IE (la plupart du temps) mais jamais en FireFox.

Voici mon code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
if (typeof(JoomMyGolf.ResizeIFrame) == "undefined") {
 
	JoomMyGolf.ResizeIFrame = function(iFrame, iBody){
		var func = function() {
		    try{
		    	/*
		        if (iBody.offsetHeight) {
		        	iFrame.style.height = new jQuery(iBody).css('height');
		        } else {
		        	iFrame.style.height = (iBody.scrollHeight + 18) + "px";
		        }
		        */
		       	iFrame.style.height = (iBody.scrollHeight + 18) + "px";
		    }
		    catch(err){
		        alert('Err: ' + err.message);
		        window.status = err.message;
		    }
		}
 
		func();
	}
 
}

et l'appel à ce dernier :

Code:

1
2
<iframe name="com_mygolf_iframe" src="xxx" style="visibility: hidden; height: 1%; width: 100%; border-style: none; overflow: auto;" onload="JoomMyGolf.ReloadIFrame(this); JoomMyGolf.CheckMe();"></iframe>

19/01/2011, 21h59
NoSmoking

Bonjour,
tu nous parles de JoomMyGolf.ResizeIFrame, mais on le voit nulle part dans ton appel ou tu parles de JoomMyGolf.ReloadIFrame et de JoomMyGolf.CheckMe

donc je don't comprend

Ce n'est pas grâve, j'ai résolu mon problème.
Les difficultés avec les iframe consistent à savoir comment accéder aux objets document et window.

Voici ma solution :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 
JoomMyGolf.prototype.GetIFrameDocument = function(){
		try {
			return this.iFrame.contentDocument || this.iFrame.contentWindow.document || this.iFrame.document;
		}
		catch(err) {
			JoomMyGolf.TreatError(err);
		}
 
		return null;
	}
 
	JoomMyGolf.prototype.GetIFrameWindow = function(){
		try {
			return this.iFrame.contentWindow || this.iFrame.contentDocument.defaultView;
		}
		catch(err) {
			JoomMyGolf.TreatError(err);
		}
 
		return null;
	}
 
	JoomMyGolf.prototype.ResizeIFrame = function(){
	    try{
	       	this.iFrame.style.height = (this.GetIFrameDocument().body.scrollHeight + 18) + "px";
	    }
	    catch(err){
	        JoomMyGolf.TreatError(err);
	    }
	}

20/01/2011, 15h55
Eric2a

Salut,

Je ne savais pas que cela était possible.

Merci pour la fonction Sergejack :ccool:
21/01/2011, 11h29
Sergejack

Ça ne fonctionne que pour des sites d'un même domaine.
Et il me semble que même avec cette restriction Chrome n'accepte pas l'interaction fenêtre <-> iframe.
22/01/2011, 10h33
NoSmoking

Citation:

Envoyé par Sergejack

Ça ne fonctionne que pour des sites d'un même domaine.
Et il me semble que même avec cette restriction Chrome n'accepte pas l'interaction fenêtre <-> iframe.

effectivement en tout cas en local, ce n'est pas possible avec Chrome, en ligne je ne s'aurais dire.
04/02/2011, 10h01
Sergejack

Et bien, il s'avère que cela fonctionne aussi avec Chrome.
Je suis rassuré que Chrome soit bien au diapason avec ses concurrents à ce niveau car il n'y a pas de raison de "sécuriser" différemment.

Au fait : travailler en local (je ne parle pas de localhost mais bien de c:/...) est travailler hors de tout domaine, donc il n'est pas surprenant que ça puisse ne pas marcher dans ce contexte là.