How do I detect iframe resize?

Question

Is there a way to detect if content of my iframe has changed?

My workaround is I have a loop which constantly check for the height of the content it effective but not efficient is there another way of doing this?

how do you mean content changed? A refresh to another url? A form element updated? Not sure the height is going to help you if two pages have equal height. Also if they load a page from another domain you wont be able to access the height of the doc body? Need more info — redsquare, Aug 17 '09 at 09:03

score 5 · Accepted Answer · answered Aug 17 '09 at 09:12

5

Since the contents of the iframe has a separate window element, you can do this in a script inside of the iframe.

$(window).resize(function(){
  var object = $(this)
  // Use `object.height()` and `object.width()`.
});

You could also use $("#the_iframe")[0].contentWindow.window (or something like that) instead of window to access the window object of the iframe from the scope that contains the iframe.

answered Aug 17 '09 at 09:12

August Lilleaas

54,010
13
102
111

1

-1 - Unfortunately this is not correct. This will only fire when the `` width changes and not when the content of the iframe changes. From what I can tell, the only way to notice that change is sadly through polling :( – anthony sottile Nov 10 '14 at 02:53

score 1 · Answer 2 · answered Mar 19 '13 at 12:30

1

this solved the problem :

iframe code:

<body onload="parent.alertsize(document.body.scrollHeight);">

parent page :

<script>
function alertsize(pixels){
 pixels+=32;
document.getElementById('myiframe').style.height=pixels+"px";
}
</script>

answered Mar 19 '13 at 12:30

Blazer

306
4
16

score 1 · Answer 3 · answered Aug 26 '11 at 02:46

      setInterval(function() {
                var ifm = document.getElementById("UIMain");
                var h = ifm.contentWindow.document.body.scrollHeight;
                ifm.height = h < 400 ? 400 : h;
          }, 800);

pure javascript is OK.didn't need jquery.

How do I detect iframe resize?

3 Answers3

Linked