[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 476
  • Last Modified:

Get floating frame to fill remaining space

Hi,

I have 3 floating frames on a webpage that split the page into 3 horizontal areas. The first 2 frames are fixed heights but I would like the last frame to fill the remaining height in the window. Does anyone know how to do this?

<IFRAME SRC="TopFrame.html" WIDTH=100% HEIGHT=250 MARGINWIDTH=0 >
<IFRAME NAME="TableHeading" WIDTH=100% HEIGHT=100 noresize>
<IFRAME NAME="MainWindow" WIDTH=100% >

I know that using non-floating frames you can do this in the surrounding FRAMESET (250,100,*) but this doesn’t work for floating frames.

The reason I can’t do this with non-floating frames is that my frame page is called with FORM data and it has some dynamic elements to submit this data to one of the frames.
0
AndyReed
Asked:
AndyReed
  • 2
1 Solution
 
knightEknightCommented:
<HTML>
<HEAD>
<SCRIPT language='javascript'>

function getX(obj)
{
  return( obj.offsetParent==null ? obj.offsetLeft : obj.offsetLeft+getX(obj.offsetParent) );
}

function getY(obj)
{
  return( obj.offsetParent==null ? obj.offsetTop : obj.offsetTop+getY(obj.offsetParent) );
}

function resize()
{

   var h = document.body.clientHeight
         - (document.all.TopFrame.height*1)
         - (document.all.TableHeading.height*1)
         - getY(document.all.TopFrame)
         - 5;

   document.all.MainWindow.height = h;

}

</script>
</head>
<BODY onLoad='resize();' onresize='resize();'>

<IFRAME NAME="TopFrame"     id="TopFrame"      WIDTH=100%  HEIGHT='200'  SRC="adressen.txt"  MARGINWIDTH=0 />
<IFRAME NAME="TableHeading" id="TableHeading"  WIDTH=100%  HEIGHT='100'  noresize />
<IFRAME NAME="MainWindow"   id="MainWindow"    WIDTH=100% />

</body>
</html>
0
 
knightEknightCommented:
oops, src for the top frame should be:  SRC="TopFrame.html"
0
 
EricWestboCommented:
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

    if (navigator.appName == 'Netscape' && document.layers != null) {
        wid = window.innerWidth;
        hit = window.innerHeight;
    }

    if (document.all != null){
        wid = document.body.clientWidth;
        hit = document.body.clientHeight;
    }

    var fil = hit - 350;
    document.write('<IFRAME SRC="TopFrame.html" WIDTH=100% HEIGHT=250 MARGINWIDTH=0>');
    document.write('<IFRAME NAME="TableHeading" WIDTH=100% HEIGHT=100 noresize>');
    document.write('<IFRAME NAME="MainWindow" WIDTH=100% HEIGHT=' + fil +'>');

</script>
0
 
AndyReedAuthor Commented:
Perfect, thanks knightEknight.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now