Forum Moderators: open
I have pages that nest iframes and I am trying to get the iframes to dynamically resize when the browser is resized. The only iframe I ever want to have a scrollbar is the innermost. My code now looks something like this:
Page1.htm
function resize()
{document.all.mainFrame.height = document.body.offsetHeight - document.all.mainFrame.offsetTop - 5; }
<body onload=resize() onresize=resize()>
<iframe name=mainFrame id=mainFrame src=Page2.htm scrolling=no>
Page2.htm
function resize()
{document.all.mainFrame.height = document.body.offsetHeight - document.all.mainFrame.offsetTop - 5; }
<body onload=resize() onresize=resize()>
<iframe name=mainFrame id=mainFrame src=Page3.htm>
When resizing the browser window, the outermost frame appears to resize just fine (no scrollbars on the browser window). But the inner frame doesn't so that when shrinking the browser window the inner frame sinks below the bottom of the outerframe and out of view. I hope that makes some kind of sense. The object is to get the edges of the frames to look something like this:
¦ ¦ ¦_______________________¦ ¦ ¦
¦ ¦__________________________¦ ¦
¦_____________________________¦
For any size of the browser window (outside border in diagram).
Thanks for any help.
Jeho
You could maybe use an overflow div with two classes?
I have attempted to resize my site (which uses frames) with an onresize function for the body by reloading the window. That might help better I'd think?
