Hi, my names is James,

I have website which has a general layout: title, navigation and main content.
I know how to use ordinary frames but they split up my page design and I don't like having three different frame pages.

I have recently looked into iframes which are brilliant for what I need apart from one factor:
My navigation loads pages into the iframe but my pages are different sized in length, so either the whole document doesn't fit into the iframe or there is a big gap at the end.

I found some "auto sizing iframes" code that will resize the iframe to the length of the document loaded, but I can't ever get it to work!

I really need some help in understanding where to place the javascript in my html pages for it to work.

This is the code I am using:

<script type="text/javascript">

/************************************************** ***********************
This code is from Dynamic Web Coding at http://www.dyn-web.com/
See Terms of Use at http://www.dyn-web.com/bus/terms.html
regarding conditions under which you may use this code.
This notice must be retained in the code as is!
************************************************** ***********************/

function getDocHeight(doc) {
var docHt = 0, sh, oh;
if (doc.height) docHt = doc.height;
else if (doc.body) {
if (doc.body.scrollHeight) docHt = sh = doc.body.scrollHeight;
if (doc.body.offsetHeight) docHt = oh = doc.body.offsetHeight;
if (sh && oh) docHt = Math.max(sh, oh);
}
return docHt;
}

function setIframeHeight(iframeName) {
var iframeWin = window.frames[iframeName];
var iframeEl = document.getElementById? document.getElementById(iframeName): document.all? document.all[iframeName]: null;
if ( iframeEl && iframeWin ) {
iframeEl.style.height = "auto"; // helps resize (for some) if new doc shorter than previous
var docHt = getDocHeight(iframeWin.document);
// need to add to height to be sure it will all show
if (docHt) iframeEl.style.height = docHt + 30 + "px";
}
}

function loadIframe(iframeName, url) {
if ( window.frames[iframeName] ) {
window.frames[iframeName].location = url;
return false;
}
else return true;
}
</script>

<div class="iframe">
<iframe name="ifrm" id="ifrm" src="http://www.mypage.html" width="600" height="300" scrolling="no" frameborder="0">Sorry,
you cannot view this web page because your browser doesn't support iframes.</iframe>
</div>