Home » IT & Tech Blogs » Information Technology » Auto resize iframe window

Auto resize iframe window

Here’s how to auto resize an iframe window with Javascript; just change the iframe name to match (ie. iframename)!  Same domain only…

<script type=”text/javascript”>

//Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
//Separate each ID with a comma. Examples: [“myframe1”, “myframe2”] or [“myframe”] or [] for none:
//Put this script inside the <head></head>

var iframeids=[“maincntnt”]

//Should script hide iframe from browsers that don’t support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide=”no”

var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf(“Firefox”)).split(“/”)[1] var FFextraHeight=parseFloat(getFFVersion)>=0.1? 3 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers

function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
var iframeid = iframeids;
if (document.getElementById)
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide==”no”){
var tempobj=document.all? document.all[iframeid] : document.getElementById(iframeid)

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener(“load”, readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent(“onload”, readjustIframe) // Bug fix line
currentfr.attachEvent(“onload”, readjustIframe)

function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)

function loadintoIframe(iframeid, url){
if (document.getElementById)

if (window.addEventListener)
window.addEventListener(“load”, resizeCaller, false)
else if (window.attachEvent)
window.attachEvent(“onload”, resizeCaller)


Check Also

Magento2 310x165 - The Best Ways to Consider WooCommerce to Magento Migration

The Best Ways to Consider WooCommerce to Magento Migration

Listen to Audio The commerce industry has witnessed tremendous growth in the past decade. Numerous …


  1. if i were you, i would make it more easier for the newbies understand the facts about the iframe you just mention here..

    You give them with no clue.. ??
    Can you be more spesific at least a demo maybe?

    I was trying to find something like this but in the future what i’ve had it’s just a failure..

    Thanx anyway..

  2. Very useful post. Thank you for sharing this.

  3. This works for me!

  4. I think your blog is very good!

  5. Great script!

  6. Works like a charm. Enclose in javascript.

  7. Is there a wordpress plugin that autosizes iframe?

Do NOT follow this link or you will be banned from the site!