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

    Problem with iframe dynamic height auto adjusting

    I use the following code to achieve dynamic iframe height:

    In the <head>:
    <script src="jquery-1.10.2.min.js"></script>
    <script language="javascript" type="text/javascript">
      function resizeIframe(obj) {
        obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
    	var iframeDoc = $('iframe[name="dservers"]').contents().get(0);
        docHeight = $(iframeDoc).height();
        $('iframe[name="dservers"]').height( docHeight );
    In the <body>
    <iframe name="dservers" src="dual_core.html" width="100%" frameborder="0" scrolling="no" onload='javascript:resizeIframe(this);' /></iframe>
    This code works fine and it dynamically adjust the height.
    The Problem here is the Firefox. It do adjust the height of the iframe dynamically but when the content height in the iframe decrease, the iframe doesn't decrease with it. So it is auto adjusting the height if it is getting taller only and not shrinks if the height decreased, causing big unwanted white space. Chrome and IE are working fine at the moment.

    Here is my page. Please take a look on it and let me know if anyone has any solution for this problem. Any help would be appreciated, Thank you guys!

    Some Screenshots:

    Attached Thumbnails Attached Thumbnails -ps_blur1_chrome-jpg   -ps_blur2_chrome-jpg  

  2. #2
    Master Coder
    Join Date
    Jan 2011
    Thanked 762 Times in 760 Posts
    Your link does not work - I was forbidden and got
    You don't have permission to access /dedicated-servers/ on this server.

    Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
    From the blurred image you posted; stop using iframes! What you have can and should be done in normal HTML using DIVs and min-height.
    Evolution - The non-random survival of random variants.

    Because I love FLEXBOX and tired of waiting: http://davidwalsh.name/goodbye-vendor-prefixes


Posting Permissions

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