Resizing Iframes

skauntey · April 24, 2016

Hi all,

I am looking for a working solution to resize iframe height and width.

I have used an iframe to embed a submission form on my website. This form has various rules (4 in total) in place so as per option selected by the users , the form will change its height.

Ideally, I would like to resize the iframe accordingly. Will appreciate if somebody could share a successful solution they might have come across?

I have browsed a bit and found an interesting discussion thread on stack overflow . I tried various alternatives BUT with no success!

The code that I have currently embedded on the webpage is below,

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

<head>

function autoResize(id){

var newheight;

var newwidth;

if(document.getElementById){

newheight = document.getElementById(id).contentWindow.document .body.scrollHeight;

newwidth = document.getElementById(id).contentWindow.document .body.scrollWidth;

}

document.getElementById(id).height = (newheight) + "px";

document.getElementById(id).width = (newwidth) + "px";

}

</script>

</head>

<body>

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

Any help most welcome!

Thanks in advance. K

MayMusic · October 13, 2016

Try this:

<iframe name="" id="iFrame1" title="02 Inline Providers_with FY choice" src="URL">Sorry, but your browser does not support frames.</iframe>


<script type="application/javascript">

function resizeIFrameToFitContent( iFrame ) {

    iFrame.width  = "100%";
    iFrame.height = "500px";
}


    var iFrame = document.getElementById( 'iFrame1' );
    resizeIFrameToFitContent( iFrame );

    // or, to resize all iframes:


</script>

Login

Resizing Iframes

Recommended Posts

skauntey

Link to comment

Share on other sites

MayMusic

Link to comment

Share on other sites

Join the conversation

Browse