iFrame Automatic Sizing
Before the "beating a dead horse&q开发者_如何学运维uot; comments begin, let me clarify what I am trying to do to see if someone can help me.
I have a parent window with an iFrame in it. The content in the iFrame is loaded from a separate domain which is where I think my problems begin, although it needs to be this way. When the page originally loads I have the following running:
<script language="javascript" type="text/javascript">
var reportFrame = document.getElementById('report');
function resizeIframe() {
var height = document.documentElement.clientHeight;
height -= reportFrame.offsetTop;
// not sure how to get this dynamically
height -= 20; /* whatever you set your body bottom margin/padding to be */
reportFrame.style.height = height + "px";
}
reportFrame.onload = resizeIframe;
window.onresize = resizeIframe;
</script>
This works great. The iFrame doesn't have any scrollbars and looks perfect to how I want. The problem I run into is the iFrame has a button that causes a post-back on the frame. I need to have this script run when the iFrame reloads itself to prevent any scrollbars from showing. Due to the child page being on a separate domain I'm not able to call a function from it to the parent (pretty sure this is where XSS comes into play) so I need to come up with another way for the parent to know it needs to run this script because the iFrame is reloading itself.
Any suggestions?
You could add a timer which checks and resizes at regular intervals:
setInterval( "resizeIframe()", 1000 ); //check every second
[Edit - links for resize scripts]
Check out http://geekswithblogs.net/rashid/archive/2007/01/13/103518.aspx and Resizing an iframe based on content for scripts on resizing an iframe.
精彩评论