web analytics
Friday , 28 October 2016
Home » IT and 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)


Any other comments or pointers? Please leave in the comments section below:




  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?

Support us!

If you like this site please follow us and click on any of these buttons!

Powered by WordPress Popup