locked
how to resize iframe height auto after page loaded insideit RRS feed

  • Question

  • User-1634604574 posted

    i have this iframe inside div i want to make height that iframe auto after page loaded inside it 

    <div>
    <iframe  onload='autoResize(this)' class='IDNAME' style='height:100%;width:100%;border:none;display: block;;overflow: hidden;'  scrolling='no' src='/temp/c.html' type='text/html' ></iframe> 
    
    </div>

    that code is not working fine 

    Friday, January 10, 2020 6:31 PM

All replies

  • User-474980206 posted

    assuming the content follows the same-origin policy. autosize is:

    function autoResize(iFrame) {
        iFrame.width  = iFrame.contentWindow.document.body.scrollWidth;
        iFrame.height = iFrame.contentWindow.document.body.scrollHeight;
    }  
    

    Friday, January 10, 2020 9:42 PM
  • User-1634604574 posted

    if i want to resize height of that div after iframe is loaded how can i do it 

    note: that iframe return result with ajax

    Saturday, January 11, 2020 6:30 AM
  • User288213138 posted

    Hi zhyanadil,

    if i want to resize height of that div after iframe is loaded how can i do it 

    You can try below code. you can resize the iframe by height and width.

    <script>    
            function autoResize() {
                var iframe = document.getElementById("myFrame");
                iframe.style.height = "1000px";
                iframe.style.width = "400px";               
            }
        </script>
    
    <div>
            <iframe onload='autoResize()' id="myFrame" class='IDNAME' style='height:100%;width:100%;border:none;display: block;;overflow: hidden;' scrolling='no' src='/temp/c.html' type='text/html'></iframe>
        </div>

    If you want to adjust iFrame Height automatically according to its contents using JavaScript, you can refer to this link: https://www.tutorialrepublic.com/faq/automatically-adjust-iframe-height-according-to-its-contents-using-javascript.php

    Best regards,

    Sam

    Monday, January 13, 2020 2:36 AM