Come ridimensionare un iframe all'interno della pagina contenente?

Question

Desidero accedere all'iframe in cui si trova la mia pagina e ridimensionarla. A proposito, lo sto facendo in javascript.

It's something like parent and height or offsetHeight.

<iframe src="mypage.asp" height="400" width="400" ></iframe> 

E in mypage.asp io do qualcosa simile in questo modo:

var h = // new height; 
parent.height = h; 

Ma non è tutto a posto? Qualcun altro che ne sa di più?

Answer 1

Provalo se desideri ridimensionare l'iframe dalla pagina caricata nell'iframe. Sembra funzionare a livello locale almeno:

function doIt() { 
    var elem = window.parent.document.getElementById('myIframe'); // the id of your iframe of course 
    elem.style.height = '40em'; 
} 

presumo sia la pagina e la tua iframe sono tue e hanno lo stesso "origine".

Answer 2

Risolverei questo utilizzando window.postMessage. Questo invia un messaggio dall'iframe alla pagina padre contenente l'iframe. Quindi puoi aggiornare l'altezza nel genitore. Cercando di impostare l'altezza dall'iframe si ottengono dei limiti di prevenzione XSS per browser davvero pessimi.

Un bell'esempio è here:

genitore:

// Every two seconds.... 
setInterval(function() { 
    // Send the message "Hello" to the parent window 
    // ...if the domain is still "davidwalsh.name" 
    parent.postMessage("Hello","http://davidwalsh.name"); 
},1000); 

iframe:

// Create IE + others compatible event handler 
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent"; 
var eventer = window[eventMethod]; 
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message"; 

// Listen to message from child window 
eventer(messageEvent,function(e) { 
    console.log('parent received message!: ',e.data); 
},false);