Iframe re-sizing code - working but don't know why!

Hi

I have found some code on the web (http://www.notesninjas.com/A555F9/nn.nsf/501e3dcf1966be1986256f42003d15df/bf7710e573dd7f0186256e52005a9c08!OpenDocument) and I have implemented it fine in my JSHeader (see below).

But I am not quite sure what it is doing, can anyone explain the if statement ?

What are these two lines testing for ?

1 - if(document.getElementById && !(document.all))

2 - else if(document.all)

Many Thanks

Paul

function iFrameHeight(iframeid)

{

// used by iframes to adjust size to content

if(document.getElementById && !(document.all)) 

{

h = document.getElementById(iframeid).contentDocument.body.scrollHeight;

document.getElementById(iframeid).style.height = h;

}

else if(document.all) 

{

h = document.frames(iframeid).document.body.scrollHeight;

document.all[iframeid].style.height=h;

}

}

Subject: Iframe re-sizing code - working but don’t know why !!

The feature tests are for:

  1. DOM-compliant browsers other than Internet Explorer (and Opera, which uses Internet Explorer’s document.all collection); and

  2. Internet Explorer and Opera.

If a browser understands document.getElementById() but doesn’t understand document.all, it will use the W3C ECMAScript bindings for the HTML DOM (essentially the same thing as Netscape/Mozilla’s JavaScript 1.4 version). In that version, getting the document that lives in a frame means getting the .contentDocument of the frame. In Internet Explorer, you just get the .document.

In both cases, the code gets the total used body height of the document in the frame (the .scrollHeight) and assigns it to the variable “h”. The value in “h” is assigned to the .style.height of the iframe element.

All currently active versions of Internet Explorer support document.getElementById(), but the IE fork of the code here should actually work in IE 4!!

Subject: RE: Iframe re-sizing code - working but don’t know why !!

Stan,

Thanks for you message and thanks for you explanation but I still don’t know what condition is being tested for, please bear with me!!.

For example if the condition was:

document.getElementById => 10

I would understand, but I don’t understand how it works when there is only a left hand side of the equation.

What does:

document.getElementById && !(document.all)

or

document.all

actually test for ?

Does my question make sense ?

Also, we are only using IE 6 or IE 7 here so can I simplify the code at all ?

Thanks again,

Paul

Subject: RE: Iframe re-sizing code - working but don’t know why !!

document.getElementById tests for the existance off the method. if it is suppported it’s not null otherwise it is and the condition becomes false.

Joost

Subject: RE: Iframe re-sizing code - working but don’t know why !!

And yes, you can simplify – but it’ll come back to bite you on the ass if your default desktop ever changes. It’s better to leave it alone, but if you insist:

var iframeObj = document.frames[0];

iframeObj.style.height = iframeObj.document.body.scrollHeight;

or, to keep it cross-browser:

var iframeObj = document.frames[0];

iframeObj.style.height = document.all ? iframeObj.document.body.scrollHeight : iframeObj.contentDocument.body.scrollHeight;

Note that in the second sample, I am testing document.all to see if it returns null (false).

Subject: many thanks

thanks for all the responses

much appreciated

Subject: Iframe re-sizing code - working but don’t know why !!

it was hard to write, it should be hard to understand! :slight_smile:

Nice to have comments that some thing is working for a change :wink:

The if code basically works for the 2 different Web Document Object Models for firefox and ie.

-Adam Foster

http://NotesNinjas.com