Resize IFRAME

[Jills]

Hi All,

Does anyone have any idea about how can we resize an IFRAME
dynamically according to its content from another domain? I want to
increase the height according to the page that is displayed on it.

Regards,
Jills

[Henry]

Re: Resize IFRAME

On Jun 9, 2:28 pm, Jills wrote:

Does anyone have any idea about how can we resize an IFRAME
dynamically according to its content from another domain? I
want to increase the height according to the page that is
displayed on it.

The document object representation of a page from a different domain
will be inaccessible and so it will not be possible to determine the
display dimensions of that document. Without that information it will
not be possible to alter the height of the IFRAME to match the height
of that document.

[Bart Van der Donck]

Re: Resize IFRAME

Henry wrote:

On Jun 9, 2:28 pm, Jills wrote:
>

>Does anyone have any idea about how can we resize an IFRAME
>dynamically according to its content from another domain? I
>want to increase the height according to the page that is
>displayed on it.

>
The document object representation of a page from a different domain
will be inaccessible and so it will not be possible to determine the
display dimensions of that document. Without that information it will
not be possible to alter the height of the IFRAME to match the height
of that document.

The original poster didn't mention how the iframe gets its new
content. When that instruction originates from the same domain as the
change of height, there is no problem:

<iframe id="ifr" height="100"></iframe>
<hr>
<input type="button" value="Google" onClick="
document.getEle mentById('ifr') .src='http://www.google.com' ;
document.getEle mentById('ifr') .height='200px' ;
">
<input type="button" value="Altavist a" onClick="
document.getEle mentById('ifr') .src='http://www.altavista.c om';
document.getEle mentById('ifr') .height='350px' ;
">

--
Bart

[preet]

Re: Resize IFRAME

The html portion
------------------
<iframe id="myframe" src="externalpa ge.htm" scrolling="no"
marginwidth="0" marginheight="0 " frameborder="0" vspace="0" hspace="0"
style="overflow :visible; width:100%; display:none"></iframe>

Now the javascript to use
-----------------------
<script type="text/javascript">

//Input the IDs of the IFRAMES you wish to dynamically resize to match
its content height:
//Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or
["myframe"] or [] for none:
var iframeids=["myframe"]

//Should script hide iframe from browsers that don't support this script
(non IE5+/NS6+ browsers. Recommended):
var iframehide="yes "

var
getFFVersion=na vigator.userAge nt.substring(na vigator.userAge nt.indexOf("
Firefox")).spli t("/")[1]
var FFextraHeight=p arseFloat(getFF Version)>=0.1? 16 : 0 //extra height
in px to add to iframe in FireFox 1.0+ browsers

function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.len gth; i++){
if (document.getEl ementById)
resizeIframe(if rameids[i])
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getEle mentById) && iframehide=="no "){
var tempobj=documen t.all? document.all[iframeids[i]] :
document.getEle mentById(iframe ids[i])
tempobj.style.d isplay="block"
}
}
}

function resizeIframe(fr ameid){
var currentfr=docum ent.getElementB yId(frameid)
if (currentfr && !window.opera){
currentfr.style .display="block "
if (currentfr.cont entDocument &&
currentfr.conte ntDocument.body .offsetHeight) //ns6 syntax
currentfr.heigh t =
currentfr.conte ntDocument.body .offsetHeight+F FextraHeight;
else if (currentfr.Docu ment && currentfr.Docum ent.body.scroll Height)
//ie5+ syntax
currentfr.heigh t = currentfr.Docum ent.body.scroll Height;
if (currentfr.addE ventListener)
currentfr.addEv entListener("lo ad", readjustIframe, false)
else if (currentfr.atta chEvent){
currentfr.detac hEvent("onload" , readjustIframe) // Bug fix line
currentfr.attac hEvent("onload" , readjustIframe)
}
}
}

function readjustIframe( loadevt) {
var crossevt=(windo w.event)? event : loadevt
var iframeroot=(cro ssevt.currentTa rget)? crossevt.curren tTarget :
crossevt.srcEle ment
if (iframeroot)
resizeIframe(if rameroot.id);
}

function loadintoIframe( iframeid, url){
if (document.getEl ementById)
document.getEle mentById(iframe id).src=url
}

if (window.addEven tListener)
window.addEvent Listener("load" , resizeCaller, false)
else if (window.attachE vent)
window.attachEv ent("onload", resizeCaller)
else
window.onload=r esizeCaller

</script>
-----------------------------

This will resize your iframe to the dimension of the source.

Enjoy






--------------------------

http://www.eecpindia.com

http://www.anchorfx.com

http://forex.eecpindia.com

*** Sent via Developersdex http://www.developersdex.com ***