controlling iframe with JS

I have three iframes laid out side by side and I have a script that I found to resize the righthand iframe to size of the document loaded. I need the other two to resize to 100% height based on whatever the righthand iframe resizes to so that they can all meet a footer at the bottom of the page. In Safari it works fine to set the height in the iframe tag to 100%, but in firefox, the left and center frames do not resize (staying around 2-300px deep). I believe the solution is to set a timeout so all the frames can load and then resize the left and middle, but my code is not working any suggestions?

here is the first code:
<script type="text/javascript">

/***********************************************
* IFrame SSI script- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/

//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=["rightContent"]

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

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

function dyniframesize() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById){ //begin resizing iframe procedure
dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);
if (dyniframe[i] && !window.opera){
dyniframe[i].style.display="block"
if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight) //ns6 syntax
dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight+FFextraHeight;
else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) //ie5+ syntax
dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
}
}
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}

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

</script>

here is the second:
<script type="text/javascript">

function resizeIframe()
{
document.getElementById("leftContent").style.height = "900px";
setTimeout ( "setSize()", 2000 );
}

function setSize()
{
document.getElementById("leftContent").style.height = "100%";
}
</script>

I'm not sure I understand your function "resizeIframe()".

I usually test whether a frame is fully loaded like this:


function changeframeSrc(){

if(frames[0]){
//this changes the frame source to another page, but you could do whatever:
frames[0].location='page03.htm';}

else{setTimeout("changeframeSrc()",100);}

}
changeframeSrc();



Ellen

if the frames are src'd to a different domain, you cannot tell how "bog" the content is.


you will likely need to set the style.position of the iframe to "absolute", "fixed", or "relative' to get pixel widths working in firefox.