How to resize iframe inside contained page?

I want to access the iframe on which my page is located and resize it. By the way, I am doing this in javascript.

This is something like parent and height or offsetHeight.

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

And in mypage.asp I do like this:

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

But is it all wrong? Anyone who knows more?

+5
source share
2 answers

Try this if you want to resize the iframe on the page loaded in your iframe. It seems to work locally, at least:

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

I assume that both the page and your iframe are yours and have the same "origin".

+4
source

, window.postMessage. iframe , iframe. . iframe XSS .

:

:

// 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);
+2

All Articles