Cross bowser iframe auto-resize script

Kaali Global

|

Cross bowser iframe auto-resize script

A useful script to automatically resize an iframe (height and width) to fit contents in. No scrollbars ever again!! I use this to display a DHTML site tree inside an iframe. The height of the iframe is dynamically set to contain the tree contents without displaying the vertical scrollbars.

This is a cross browser script and I have tested it in IE, Netscape (Mozilla), Opera and others that I could get my friends to help me out with.

To test this script create an html page, something like:

<html>

Cross bowser iframe auto-resize script

<script type="text/javascript">
function autoIframe(frameId){
try{
frame = document.getElementById(frameId);
innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
objToResize = (frame.style) ? frame.style : frame;
objToResize.height = innerDoc.body.scrollHeight + 10;
}
catch(err){
window.status = err.message;
}
}
</script>

<iframe id="tree" name="tree" src="tree.htm" onload="if (window.parent && window.parent.autoIframe) {window.parent.autoIframe('tree');}"></iframe>

Call it iframe.htm or anything else that you want. Also create an html page called tree.htm or any other page that you want to display in the iframe. Make sure that the iframe.htm and the tree.htm are in the same domain.

Now point your browser to http://yourdomain/iframe.htm and see the magic yourself!!

Author: Arvind Sharma, last update: 17th Sep 2005

|

© 2005 - 2010 Kaali. All rights reserved.