[TUT] Auto-Expanding Iframes.

Florx · 06-04-2007, 04:29 AM

Hello! Thanks for attempting to read this load of mashed up html code and random speeches! So lets start.

1) You need to put this code into your <head> tags:

HTML Code:

<script type="text/javascript">
var iframeids=["content"]
var iframehide="yes"
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 47 : 0
/*
Internet explorer seems to think it can make it's own rules about the internet.
*/
function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//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"
}
}
}

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight; 
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}

function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}

function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}

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

</script>

2) You need to have an iframe with an id of content e.g.

HTML Code:

<iframe id="content"></iframe>

Thats about it really. Any problems POST \/ :eusa_whis

Thanks for reading.

FlorX

Robbie · 06-04-2007, 08:30 AM

You forgot to credit DynamicDrive.

F32 · 06-04-2007, 08:39 AM

Indeed.

That code is illegal unless you include the DD copyright comments in the JS file.

Hardly a tutorial anyway - c&p isn't a tutorial?

alexxxxx · 06-04-2007, 08:41 AM

he's c&p a tutorial. so? give this guy some credit.

and it's a code that could be used by anyone.

hybride · 06-04-2007, 08:41 AM

This tutorial is available from DynamicDrive, thanks for putting it up but you should have left the credits.

I highly recommend to any webmasters that you do NOT use this script as users with without Javascript will experience difficulty viewing your website!

F32 · 06-04-2007, 08:43 AM

Originally Posted by [ALEX]

he's c&p a tutorial. so? give this guy some credit.

and it's a code that could be used by anyone.

He's breaching copyright - a lawyer wouldn't "give the guy some credit".

Frog! · 06-04-2007, 08:51 AM

As i have said many a time.

"Respect4U = 0"

:Edzy · 06-04-2007, 09:11 AM

Originally Posted by FlorX

Hello! Thanks for attempting to read this load of mashed up html code and random speeches! So lets start.

1) You need to put this code into your <head> tags:

HTML Code:

<script type="text/javascript">
var iframeids=["content"]
var iframehide="yes"
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 47 : 0
/*
Internet explorer seems to think it can make it's own rules about the internet.
*/
function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//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"
}
}
}
 
function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight; 
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}
 
function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}
 
function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}
 
if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
 
</script>

2) You need to have an iframe with an id of content e.g.

HTML Code:

<iframe id="content"></iframe>

Thats about it really. Any problems POST \/ :eusa_whis

Thanks for reading.

FlorX

it would be nice to know how to slice a compatible one also

ScottDiamond · 06-04-2007, 10:43 AM

Originally Posted by FlorX

Hello! Thanks for attempting to read this load of mashed up html code and random speeches! So lets start.

1) You need to put this code into your <head> tags:

HTML Code:

<script type="text/javascript">
var iframeids=["content"]
var iframehide="yes"
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 47 : 0
/*
Internet explorer seems to think it can make it's own rules about the internet.
*/
function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//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"
}
}
}
 
function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight; 
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}
 
function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}
 
function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}
 
if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
 
</script>

2) You need to have an iframe with an id of content e.g.

HTML Code:

<iframe id="content"></iframe>

Thats about it really. Any problems POST \/ :eusa_whis

Thanks for reading.

FlorX

Let me get started with my cup of tea.

1) It's Javascript, not 'mashed up HTML'.
2) The iFrame wont work as you have not included src="link" to display the content.
3) Most important, it's DD's.

4) Lol.

PinkFM · 06-04-2007, 01:02 PM

Thats not auto expanding ifram
The ifram code does not say "expanding"
its just a load of JS making it expand.

Thread: [TUT] Auto-Expanding Iframes.

Thread Tools

[TUT] Auto-Expanding Iframes.

Posting Permissions