Firefox 6 and Javascript: parent.document.getElementById('name').contentDocument.height not working
In my site I have a Javascript function that resizes the iframe. The part related to Firefox is the following:
var fr2 = parent.document.getElementById('name'); if(fr2.contentDocument) { var doc1 = fr2.contentDocument; h = doc1.height + 60; if (h < 280) fr2.style.height = "280px"; else fr2.style.height = h + "px"; }
With Firefox 6 this does not work anymore. In particular, if I print the variable "h" I obtain NaN. Do you know what is changed?
Thanks, Fabrizio
Geändert am
Alle Antworten (3)
Hi Fabrizio,
Today I had the same problem and I did it to resolve: 1) Remove the http:// from the src=".." of tag iframe. Now object contentDocument going to exists. 2) IF you can't edit the main page which contains iframe, you can do this:
- on src of iframe page, insert:
<script type="text/javascript"> window.onload = function(){ top.document.getElementById('blockrandom').contentDocument['height'] = document.getElementsByTagName("body")[0].offsetHeight; } </script>
- Change "blockrandom" to your id iframe.
But, If you can edit the main page, you can use this method to get height of your page :
document.getElementById('blockrandom').contentDocument.body.scrollHeight
Where, again blockrandom is your id iframe.
I hope I have helped.
BR.
Geändert am
Sorry, I forgot in the 'document.getElementsByTagName("body")[0].offsetHeight' to work you need set CSS tag body with height, like this:
<style type="text/css"> body { height: 1000px; } </style>
BR.
Geändert am
Hi and thanks for your reply! I can post my solution, that is a related directly to my problem.
The solution can be accessing the style of the body, parsing the height or the width (in fact, now they are no more a number like ‘60’, but something like ‘60px’) and use it. As an example, if the JavaScript code was:
var fr2 = parent.document.getElementById('name'); var doc1 = fr2.contentDocument; var h = doc1.height + 60; fr2.style.height = h + "px";
Now you have to do something like this (I am too verbose to simplify the comprehension):
var fr2 = parent.document.getElementById('name'); var doc1 = fr2.contentDocument; var body = doc1.getElementsByTagName('body')[0]; var h = parent.window.getComputedStyle(body, null).height; var length = h.length; h = h.substring(0, length-2); //remove px from the string h = parseFloat(h) + 60; fr2.style.height = h + "px";
Anyway, this does not work with previous versions, so you need an IF clause to check compatibility:
if (doc1.height) {
OLD CODE
} else {
NEW CODE
}