Iframe with 100% height


	My Mic to the World...

Guy Malachi

Iframe with 100% Height

Ever wonder how to create an iframe that fills the entire height (and width) of a page?
You probably tried writing something like:

<iframe width=100% height=100%></iframe>

and expected the iframe to fill up whatever it could.
The width=100% does what you expected and fills up the entire width of the page, but the height just stays about 200px.

Here's some easy JavaScript to do exactly this:

Put this in the head of your page:

<script language="JavaScript">
<!--
function resize_iframe()
{

	var height=window.innerWidth;//Firefox
	if (document.body.clientHeight)
	{
		height=document.body.clientHeight;//IE
	}
	//resize the iframe according to the size of the
	//window (all these should be on the same line)
	document.getElementById("glu").style.height=parseInt(height-
	document.getElementById("glu").offsetTop-8)+"px";
}

// this will resize the iframe every
// time you change the size of the window.
window.onresize=resize_iframe; 

//Instead of using this you can use: 
//	<BODY onresize="resize_iframe()">


//-->
</script>

And inside your page's body create the iframe tag:

<iframe id="glu" width="100%" onload="resize_iframe()">
</iframe>

If you decide to use this code all I ask is that you .