Extenable iframe? =S

[Puma]

I need help doing extenable iframe could someone give me a tutorial on this please or can someone help! xD

[alarmclock]

Hey there,

There's no tutorial needed to make an expandable iframe. You have to get a Javascript code and insert it just before your iframe code.


<script type="text/javascript">
//<![CDATA[
window.onload = function() {
var f = document.getElementById("mainframe");
function resize() {
var h = "";
var w = "";
if (f.contentDocument) {
h = f.contentDocument.documentElement.offsetHeight + 20 + "px";
// can't find anything for Opera and Firefox that works for the width. OffetWidth doesn't work right either.(f.contentDocument.documentElement,"").getPropertyValue("width");
} else if (f.contentWindow) {
h = f.contentWindow.document.body.scrollHeight + 5 + "px";
} else {
return;
}
f.setAttribute("height",h);
f.parentNode.setAttribute("height",h);
}
if (window.addEventListener) {
f.onload = resize;
} else if (f.attachEvent) {
f.attachEvent("onload", resize);
} else {
return;
}
resize();
}
//]]>
</script>
Just remember to name your iframe mainframe otherwise it won't work :P

[Puma]

Hmm.. soo then my iframe html will be <iframe src="main.html" name="mainframe" width="" height="" frameborder="0"></iframe> ??

[alarmclock]

yup :)

put id="mainframe" in there aswell, after name="mainframe"

[Puma]

am really confuse atm >____< LOOL can you show me a example?

[alarmclock]

thinkhabbo used to have it.

first you need a layout capable of expanding.

[Nick.]

am really confuse atm >____< LOOL can you show me a example?

<script type="text/javascript">
//<![CDATA[
window.onload = function() {
var f = document.getElementById("mainframe");
function resize() {
var h = "";
var w = "";
if (f.contentDocument) {
h = f.contentDocument.documentElement.offsetHeight + 20 + "px";
// can't find anything for Opera and Firefox that works for the width. OffetWidth doesn't work right either.(f.contentDocument.documentElement,"").getPropertyValue("width");
} else if (f.contentWindow) {
h = f.contentWindow.document.body.scrollHeight + 5 + "px";
} else {
return;
}
f.setAttribute("height",h);
f.parentNode.setAttribute("height",h);
}
if (window.addEventListener) {
f.onload = resize;
} else if (f.attachEvent) {
f.attachEvent("onload", resize);
} else {
return;
}
resize();
}
//]]>
</script>
<iframe src="main.html" name="mainframe" id="mainframe" width="" height="" frameborder="0"></iframe>

:)

[Colin-Roberts]

example is on colin-roberts.net i use expandable iframes..

[alarmclock]

Source always after the name and id Nick :eusa_naug


<script type="text/javascript">
//<![CDATA[
window.onload = function() {
var f = document.getElementById("mainframe");
function resize() {
var h = "";
var w = "";
if (f.contentDocument) {
h = f.contentDocument.documentElement.offsetHeight + 20 + "px";
// can't find anything for Opera and Firefox that works for the width. OffetWidth doesn't work right either.(f.contentDocument.documentElement,"").getPropertyValue("width");
} else if (f.contentWindow) {
h = f.contentWindow.document.body.scrollHeight + 5 + "px";
} else {
return;
}
f.setAttribute("height",h);
f.parentNode.setAttribute("height",h);
}
if (window.addEventListener) {
f.onload = resize;
} else if (f.attachEvent) {
f.attachEvent("onload", resize);
} else {
return;
}
resize();
}
//]]>
</script>
<iframe name="mainframe" id="mainframe" src="main.html"
width="" height="" frameborder="0"></iframe>

[Nick.]

Long time since I've done this stuff ;)

[alarmclock]

It doesn't really matter, just makes it a cleaner code - hence xhtml.

[Puma]

THanks lads =).. am goin to create a template and could you tell me if it capable or extenable iframe okies? =)

[alarmclock]

Any template can if coded properly.

[Frog!]

When i do it, the writing goes to the centre of the iFrame :(
Not at the top of the iFrame where it belongs.

[F32]

When i do it, the writing goes to the centre of the iFrame :(
Not at the top of the iFrame where it belongs.
that's because the table you have it in isn't aligned properly.

in the <td> tag put <td valign="top">

[Frog!]

Thanks, it worked a treat, +Rep

[Recursion]

Just use Ajax on an expandable layout :P

[F32]

Just use Ajax on an expandable layout :P
dont confuse even more - you dont need AJAX...

[Recursion]

I know, i just like Ajax, they are very nice when you get them working in IE...

[F32]

AJAX is a coding language thing...

[Recursion]

I know, i accedentally used 'them'.

AJAX is a form of Javascript but it is still very nice when it works in all browsers...

ATM Ive only got it working in Firefox and Opera to change the content like an iframe, but not an iframe...