Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Dec 2010
    Posts
    6
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Plz, Help with Iframe Resize

    Hello,
    I have build a tree view forum, I have used the iframe tag to import it to my wordpress blog .
    I have a script that determine the size of the iframe on load:

    Code:
    <script language="JavaScript">
    <!--
    function calcHeight()
    {
    //find the height of the internal page
    var the_height=
    document.getElementById('the_iframe').contentWindow.
    document.body.scrollHeight;
    
    //change the height of the iframe
    document.getElementById('the_iframe').height=
    the_height;
    }
    //-->
    </script>
    The problem with the script is that the forum(tree view forum) only shows topics. I have another script that displays the contents of any issue only while clicking (Void). In actual the contents of each issue is charging ahead - but the resize function of the Iframe script not see it.

    How do I fix it, that the size of the Iframe will change automatically?

    Thanks alot

  • #2
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by adir View Post
    Hello,
    I have build a tree view forum, I have used the iframe tag to import it to my wordpress blog .
    Please confirm that the parent page and the iframed page are on the same domain, because if they are not then your resizer doesn't work.

    If both documents are on the same domain, then try inserting the following code in the iframed document, that is the document inside the iframe.

    It assumes that your iframe resizer is called by the iframe's onload event, is not installed using attachEvent / addEventListener and that the <iframe> tag has the ID "if1":
    Code:
    <script type='text/javascript'>
    
    function bodyResized( id )
    {
     var ht, bdy = document.getElementsByTagName( 'body' )[ 0 ];   
     
     if( this.lastHeight === undefined )
     {
      setInterval( function(){ bodyResized( id ) }, 500 );
      this.lastHeight = bdy.scrollHeight;
     }
     else
      if( this.lastHeight !== ( ht = bdy.scrollHeight ) )
      {
       this.lastHeight = ht;
       parent.document.getElementById( id ).onload();
      }
    }
    
    bodyResized( 'if1' );
    
    </script>
    If it doesn't work and there are no console errors, I'll need to see a live demo.

  • Users who have thanked Logic Ali for this post:

    adir (12-20-2010)

  • #3
    New to the CF scene
    Join Date
    Dec 2010
    Posts
    6
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Hi dude

    Thanks for the quick reply.

    The problem still exist.. Did you meant to change the Iframe ID body tag?
    Or the top level body that contains the Iframe?
    (both not working)

    There's the PCMagazine Forum
    and there is the forum iframe <link>
    Thanks again dude

    P.S
    The forum works under phpbb.
    Last edited by adir; 12-19-2010 at 03:32 PM.

  • #4
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by adir View Post
    Thanks for the quick reply.

    The problem still exist.. Did you meant to change the Iframe ID body tag?
    Or the top level body that contains the Iframe?
    (both not working)

    There's the Forum
    and there is the forum iframe link
    First put the script in the <body> section not the <head>.

  • Users who have thanked Logic Ali for this post:

    adir (12-20-2010)

  • #5
    New to the CF scene
    Join Date
    Dec 2010
    Posts
    6
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Another

    Dude, You genius! Amazing it works perfectly.
    I just noticed that it's not compatible with chrome and firefox, is there any option to fix it please??
    Last edited by adir; 12-20-2010 at 01:39 AM.

  • #6
    New to the CF scene
    Join Date
    Dec 2010
    Posts
    6
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by adir View Post
    Dude, You genius! Amazing it works perfectly.
    I just noticed that it's not compatible with chrome and firefox, is there any option to fix it please??
    Your code is good, there's a problem with my code:\

    <script language="JavaScript">
    <!--
    function calcHeight()
    {
    //find the height of the internal page
    var the_height=
    document.getElementById('the_iframe').contentWindow.
    document.body.scrollHeight;

    //change the height of the iframe
    document.getElementById('the_iframe').height=
    the_height;
    }
    //-->
    </script>

  • #7
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    If you're testing on the file:// protocol, be aware that the current Chrome has the "characteristic" of blocking permitted cross-frame scripting, which it does not do on http://.

    'the_iframe' needs to be the ID not the name.

  • #8
    New to the CF scene
    Join Date
    Dec 2010
    Posts
    6
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Logic Ali View Post
    If you're testing on the file:// protocol, be aware that the current Chrome has the "characteristic" of blocking permitted cross-frame scripting, which it does not do on http://.

    'the_iframe' needs to be the ID not the name.
    Yeah I know, the forum works online..
    And still thats not working properly.. :\

    I found some website that talking about this issue (http://www.amirharel.com/2009/07/28/...frame-toolbar/), He published great code that work's, but my intention is to make the forum as part of the website..

    Can you look at it and tell me if there something I can do?:|
    Forum


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •