How do I detect iframe resize?

2020-02-12 06:21发布

问题:

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?

回答1:

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.



回答2:

      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.



回答3:

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>