iframe height

Discussion in 'JavaScript' started by knkk, Jun 16, 2007.

0
  1. #1
    Hi,

    I have an iframe that fetches content from a different domain. This is my URL, which has an iframe that fetches content from another site careerbuilder.co.in (this is a partnership channel, so they will co-operate if there are small things they need to do in their code, like putting something in the body tag or adding some script, though I would ideally like everything to be done in this page, and not in their pages).

    http://www.fullhyd.com/htdocs/jobs/home.html

    Now, I want that iframe's height to match that of the specific page that has loaded from careerbuilder.co.in. I have tried several different approaches, but 3 days later I am at square 1.

    Here is the source code of that page:


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<HTML>
<HEAD>
<TITLE>fullhyd.com's Career Center - Hyderabad's largest job database</TITLE>
<LINK REL="SHORTCUT ICON" HREF="favicon.ico">
<SCRIPT TYPE="text/javascript">
<!--
var loaded = 1;
function loadMyPages(pageA, pageB, pageC, pageD)
{
    if (loaded>1)
    {
        window.frames["frame1"].location.href = pageA;
        window.frames["frame3"].location.href = pageB;
        window.frames["120x600"].location.href = pageC;
        window.frames["frame4"].location.href = pageD;
    }
    loaded++;
}
// -->
</SCRIPT>
<BODY BGCOLOR="#FFFFFF"> 
<DIV ID="Layer1">
    <DIV ALIGN="LEFT">
        <IFRAME NAME="frame1" FRAMEBORDER="0" SCROLLING="NO" WIDTH="790" HEIGHT="85" SRC="careerbuilder/header.html" MARGINWIDTH="0" MARGINHEIGHT="0"></IFRAME>
    </DIV>
    <DIV STYLE="float: left; padding-left: 4px">
        <DIV>
            <IFRAME NAME="frame4" FRAMEBORDER="0" SCROLLING="NO" WIDTH="631" HEIGHT="235" SRC="careerbuilder/menu.html" MARGINWIDTH="0" MARGINHEIGHT="0"></IFRAME>
        </DIV>
        <DIV>
            <IFRAME NAME="frame2" FRAMEBORDER="0" SCROLLING="NO" WIDTH="631" HEIGHT="650" SRC="http://www.careerbuilder.co.in"  onload="loadMyPages('careerbuilder/header.html','careerbuilder/footer.html','http://www.fullhyderabad.com/adserver/iframes/120x600.php','careerbuilder/menu.html')"></IFRAME>
        </DIV>
    </DIV>
    <DIV STYLE="padding-left: 5px;">
        <SCRIPT LANGUAGE="JavaScript" SRC="http://www.fullhyderabad.com/adserver/iframes/resize.js"></SCRIPT>
        <IFRAME NAME="120x600" ID="120x600" SRC="http://www.fullhyderabad.com/adserver/iframes/120x600.php" WIDTH="125" HEIGHT="600" FRAMEBORDER="0" SCROLLING="NO"></IFRAME>
    </DIV>
 
    <DIV>
        <IFRAME NAME="frame3" FRAMEBORDER="0" SCROLLING="NO" WIDTH="631" SRC="careerbuilder/footer.html"></IFRAME>
    </DIV>
</DIV>
</BODY>
</HTML>
    Code (markup):

    The iframe named "frame2" is what I am struggling with. Everytime that someone clicks on any link from that iframe, the iframe needs to resize so that the new page that loads fits into the frame, height-wise.

    Has anyone struggled with this problem before? I'd be quite grateful for any ideas.

    Thank you for the time spent reading this!
     
    knkk, Jun 16, 2007 IP
  2. NoamBarz

    NoamBarz Active Member

    Messages:
    242
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    58
    #2
    If you use ajax instead of an Iframe, you won't have this problem. All you need to do is to create a <div id='frame2'> and place it instead of the iframe. You then get the data to display using ajax and write that into the div.

    document.getElementByID("frame2").innerHTML = textfromajax;
    That's what I'd do.
     
    NoamBarz, Jun 17, 2007 IP