How do I detect iframe resize?
11,915
Solution 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.
Solution 2
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>
Solution 3
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.
Comments
-
yoshi almost 2 years
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?
-
anthony sottile over 9 years-1 - Unfortunately this is not correct. This will only fire when the
<iframe>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 :(
