hi all,
i´m using the code attached to dymically adapt my iframe containing site to its content regarding height. so forum height changes => iframe height also changes....
it works fine with ie and worked fine with firefox 4/5. now i installed firefox 6 and it doesnt work anymore??? js is enabled......
console states: "document.all is undefined"
any idea? can anyone adapt the code?? please help!!
<head>
<script language="JavaScript">
function resize() {
var iframe = document.all.FORUM;
iframe.height=document.frames("FORUM").document.body.scrollHeight;
}
</script>
</head>
<body onload=resize();>
<iframe src="mybb/" name="FORUM" scrolling="no" width="100%" height=100% frameborder="0" onload="this.height=this.contentDocument.height"></iframe>
</body>
Why do you need frames? No one likes frames.
function resize()
{
var iframe = $("forum");
iframe.height = iframe.scrollHeight;
}
add
id="forum" to your iframe element, and I think that should work. document.all and document.frames - although they'll probably work - are ancient in coding terms.
thanks for the answer, but doesnt work. my forum is still not usable. its online and therefore very urgent :-(((
i tried as you said (see below) which does not work in ie and ff. any further ideas??
<script language="JavaScript">
function resize()
{
var iframe = $("forum");
iframe.height = iframe.scrollHeight;
}
</script>
</head>
<body onload=resize(); style="background-image:url(bg1.gif); background-repeat:repeat-x;">
<iframe src="mybb/" name="forum" id="forum" scrolling="no" width="100%" height=100% frameborder="0" onload="this.height=this.contentDocument.height"></iframe>
Do you have a link to the page?
tomm, i sent you the link, which i do not want to be published. but i will report the solution to the others once its fixed.... thanks!
thanks, tomm! the function
function resize()
{
var iframe = document.getElementById("forum");
iframe.height = iframe.contentWindow.document.body.scrollHeight;
}
works at first sight. the forum is displayed properly. BUT: when i click on a link, e.g. for displaying a thread, the iframe does not react accordingly. i guess i will have to change the onload function as well???
<iframe src="mybb/" name="forum" id="forum" scrolling="no" width="100%" height=100% frameborder="0" onload="this.height=this.contentDocument.height"></iframe>
but i dont know how :-(
if the problem could be fixed, that also the height is kept updated it would be solved!!
Took me a day to figure it, Try this:
function resize()
{
var iframe = document.getElementById('forum').contentDocument.body;
document.getElementById('forum').style.height = window.getComputedStyle(iframe,null).getPropertyValue("height");
}
It works for me. However, for some reason, the height got from this solution is shorter than the old one for 26px. (I don't know if it's only me, or not.) Therefore, I have to add more 26px to the new height.
This is my code:
{
var iframe = document.getElementById('forum').contentDocument.body;
var h = window.getComputedStyle(iframe,null).getPropertyValue("height");
//removing text 'px'
h = h.substr(0,h.length - 2);
document.getElementById('forum').style.height = (parseInt(h) + 26);
}
Hope this can help you.