Forum Moderators: open
Sometime it works, and sometimes it shows none. And at firefox, it does not show anything.
The script is here.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>dmt_sa_list</title>
<script language='JavaScript' type='text/javascript'>
<!--
function resizeFrame(iframeObj){
var innerBody = iframeObj.contentWindow.document.body;
var innerHeight = innerBody.scrollHeight + (innerBody.offsetHeight - innerBody.clientHeight);
iframeObj.style.height = innerHeight;
var innerWidth = innerBody.scrollWidth + (innerBody.offsetWidth - innerBody.clientWidth);
iframeObj.style.width = innerWidth;
this.scrollTo(1,1);
}
//-->
</script>
</head>
<body style="margin:0; background-color:transparent">
<iframe id="ca-test" name="ca-test" src="/test.php" onload="resizeFrame(this)" width='710' scrolling="no" frameborder="0" marginwidth="0" marginheight="0">
</body>
</html>
How can I make this iframe works well?
Iframes work differently in IE and firefox unless you get everything very correct.
Iframe is also part of your css which you do not show ie
div.iframe { margin-left:210px; width:530px;}
iframe { border: 1px dashed #666 }
You can change the position of the <div> with margin and also the width and height.
Then there is the javascript to go in the head.
<script type="text/javascript">
/*************************************************************************
This code is from Dynamic Web Coding at [dyn-web.com...]
See Terms of Use at [dyn-web.com...]
regarding conditions under which you may use this code.
This notice must be retained in the code as is!
*************************************************************************/
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>
Then the position of the iframe in the html page.
<div class="iframe">
<iframe name="ifrm" id="ifrm" src="main.php" width="525" height="500" scrolling="auto" frameborder="0">Sorry, your browser doesn't support iframes.</iframe>
I then set another page inside the iframe "main.php". If you set the width of this page to slightly less than the width of the iframe there will be no side scrolling. Only page up and down. Works great for me. The next hard part is to get the links to load in the iframe without needing to reload the whole page every time. Just loads the iframe.
<a href="main/contact.php" onclick="return loadIframe('ifrm', this.href)">Contact</a>
Just change the page name you want to load into the iframe.
It is a bloody great system once it works.
mine is at "islam-australia.com.au" if you want to see how well it works.
The credit must remain in the javascript.
All the best
James Smith
Thank you for your kind reply and detailed instruction.
I'll try and let you know.
