Sizing Frames

Sizing Frames Code

This page lists the pages and their HTML that contain script for running this example.

page1.htm - The outer frameset

<HTML>
  <TITLE>Sizing Framesets</TITLE>
  <SCRIPT>
    var hidden = false //Tracks the state

    function buildFrameset(state) {      
      var str = "<TITLE>Sizing Framesets</TITLE>"
      // Get the main document being displayed 
      if (frames["main"].frames.length!=0)
        bodyLoc =  frames["main"].frames["body"].location.href
      else
        bodyLoc =  frames["main"].location.href
      if (state) {
        // Display the frameset with the table of contents
        str+="<FRAMESET COLS='200,*'>"
        str+="<FRAME SRC='contents.htm'>" 
        str+="<FRAME SRC='"+bodyLoc+"' name=body>"
        str+="</FRAMESET>"
        frames["main"].document.open() 
        frames["main"].document.write(str)
        frames["main"].document.close()
      } else 
        // Do not display the frameset
        frames["main"].location.href =  bodyLoc
      hidden = !(hidden)
     }

     function testCheckbox() {
       // Initialize state
       hidden = (frames["main"].frames.length!=0)
       // Make sure frame exists
       if (frames["header"].document.forms["f1"]!=null)      
         frames["header"].document.forms["f1"].elements["c1"].checked = hidden
     }
 
     window.onload=testCheckbox;  </SCRIPT>
    <FRAMESET ROWS='120,*' ONLOAD="testCheckbox()">
      <FRAME SRC='adbar.htm' name=header>
      <FRAME SRC='main.htm' NAME=main>
   </FRAMESET>
</HTML>

AdBar.htm - The header frame

<HTML>
  <TITLE>Cross-Browser Pop-up Frames</TITLE>
  <SCRIPT>
    var p = parent.parent
    function updateFrames(el) {
      p.buildFrameset(el.checked)
    }
  </SCRIPT>
  <BODY>
    <FORM NAME=f1>
      <LABEL FOR=update>Display Contents: </LABEL>
      <INPUT TYPE="checkbox" ONCLICK="updateFrames(this)" 
             NAME=c1 ID=update CHECKED>
    </FORM>
  </BODY>
</HTML>

main.htm - The content frameset

<HTML>
  <TITLE>Article on sizing framesets</TITLE>
  <FRAMESET COLS='200,*'>
    <FRAME SRC='contents.htm'>
    <FRAME SRC='body.htm' name=body>
  </FRAMESET>
</HTML>