« Looking for old versions of downloadable applications?Add-ons have been disabled toolbar message in Internet Explorer 8 »

Auto resize iframe window

2009-06-22

Permalink 18:53:31, by galidon Email , 105 words   English (EU)
Categories: Information Technology, Tips and Tricks

Auto resize iframe window

Here's how to auto resize an iframe window with Javascript; just change the iframe name to match (ie. iframename)!


//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:
var iframeids=["iframename"]

//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 var iframeid = iframeids;
if (document.getElementById)
resizeIframe(iframeid)
//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)
tempobj.style.display="block"
}
}
}

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
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)
resizeIframe(iframeroot.id);
}

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

if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller


back to galido.net

Bookmark and Share

1 comment

Comment from: eshanne [Visitor] Email
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..
2009-10-01 @ 04:32

Leave a comment

Looking to Exchange Links? Contact Us

Your email address will not be revealed on this site.

Your URL will be displayed.
(Line breaks become <br />)
(Name, email & website)
(Allow users to contact you through a message form (your email will not be revealed.)
February 2010
Mon Tue Wed Thu Fri Sat Sun
 << <   > >>
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28

Galido.net Information Technology Blog provides you with information and links to computer tips, tricks, solutions, news and relevant information to IT related topics. Information Technology Blog provides you with information and links to computer tips, tricks, solutions, news and relevant information to IT related topics. We also feature a collection of blogs containing links to information technology related software, hardware, news, cool sites, news on gadgets, where to get them, search engine optimization, and more.

Search

XML Feeds

   Recommended Site

  • Affordable small business web design services to help you create an effective online presence. Call us to learn more about our services.

   Syndicate this Blog


Add to Google Reader or Homepage
Add to My AOL
Subscribe in Bloglines
 Subscribe in a reader

   Validate the Blog

[Valid RSS]

Gawker Artists