Determining height of embedded html object

Question

Hi!

Two questions ... I want to use the object tag to embed an html file that uses external style sheets ... however, nothing that I have tried works. The first question is how to that? ... note: the style sheets are linked to both documents.

The second question is how to determine and set the height attribute of the object so as to eliminate scrollbars ...

The object tag is inside the folllowing DIV ...

In IE8, I simply call "ScrollHeightValue('SF_010A','SF_010B')" ... which are the ids of the object tag and the body of the document being embedded.

function ScrollHeightValue(a, b) {
    var testObject1 = document.getElementById(a);
    var testObject = testObject1.getElementById(b);
    testObject1.style.height = testObject.scrollHeight + 'px';
}

Thus, the second question really is ... how do I do this for non-IE browsers?

I'm a novice ... maybe I'm not asking the questions correctly ... just want to know hoe to detetmine the height of the object so that the content of the object is visible ... without the scrollbars.

Thanks,

Bob

Answer 1

Try https://developer.mozilla.org/en/DOM/window.getComputedStyle

Answer 2

If you want to embed a HTML document in another, you must use an iframe, not an object.

Answer 3

Answer to question number one: To embed external HTML files in your page, use iframes, not "object".

Answer to question number two: To get the total height of a DOM element, use its scrollHeight property. However, this property has been reported to be off by 5px for IE 8.