iframe auto height

    Question by:
    On

    Topics:

    I am looking to create a simple set of 3 iframes like the diagram below with A and B being static in height and C is an autofit to the size of the window.

    ----------------------------
               A   (77px)
    ----------------------------
               B   (33px)
    ----------------------------


               C   (auto)


    ----------------------------

    I am basically looking to replace old frame code that looked like this....
    <body>
        <frameset rows="74,33,*" framespacing="0" border="0" frameborder="0">
              <frame src="A.asp" name="A" scrolling="no" noresize>
              <frame src="B.asp" name="B" scrolling="no" >
              <frame src="C.asp" name="C" scrolling="auto" >
        </frameset>
    </body>

    to iframes that look something like this...
    <body>
    <iframe name="A" width="100%" height="74" frameborder="0" scrolling="no" src="A.asp" ></iframe>
    <iframe name="B" width="100%" height="33" frameborder="0" scrolling="no" src="B.asp" ></iframe>
    <iframe name="C" width="100%" height="100%" frameborder="0" scrolling="auto" src="C.asp" ></iframe>
    </body>


    I cannot seem to get my height in frame C to work like it did with the traditional frameset where it would autofit to the size of the browser window.  Are there solutions to this?
    Thanks,
    Jon

     

    Verified Answer?

    The member who asked this question verified this comment provided the solution that solved their problem.

    by:Posted on 2006-03-01 at 14:52:06ID: 16080163

    How about this:

    <body style="border:0; margin:0;">
    <iframe name="A" width="100%" height="74" frameborder="0" scrolling="no" src="A.asp" ></iframe>
    <iframe name="B" width="100%" height="33" frameborder="0" scrolling="no" src="B.asp" ></iframe>
    <iframe name="C" width="100%" height="100%" frameborder="0" scrolling="auto" src="C.asp" ></iframe>
    <script>
    var fC = window.frames.C.frameElement;
    window.onresize=function(){
     fC.style.height=document.body.clientHeight-107;
    }
    window.onresize();
    </script>
    </body>

    This content is available to Experts Exchange members

    See the answer now
    with your Free 30 Day Trial

    Get unlimited access to solutions & experts

    • 4,169,477 solved questions
    • 3,805 articles & videos
    • 15,413 tech experts

    Get Access Now

    Ask Your Tech Question. Get Expert Solutions.We will email you when an expert has commented on your question.

    We will never share this with anyone. Privacy Policy Terms of Use

    Select topics

    You may select up to five topics.

    Top Expert Contributor

    Essential articles and videos from the Experts

    More valuable questions with Expert answers

    201507-LO-Qu-065