views:

152

answers:

1

I have an iframe on my index.html and this iframe is dynamic.

on my index.html I have a form, which when submitted, shows the results inside the iframe.

The problem is the Iframes height also has to be dynamic for the website to look "clean".

So in the Iframes php page, I have this code:

<body onload="parent.resize_iframe(document.body.scrollHeight)">

And in the index.html (which is the parent in this case) I have this function:

function resize_iframe(new_height){
    byId('iframe001').style.height=parseInt(new_height) + 20 + 'px';
}

The problem here is not the function, but that Safari and Chrome thinks the scrollHeight is something alot bigger than it is.

I have tried alerting the scrollHeight, and the nr is always around 2000px in Chrome and Safari, but in other browsers it is dynamic as it should be (500, 300, 800 etc)...

Any ideas?

UPDATE:

I noticed when I click a link on the index, and then click the browser back button, the iframe DOES resize correctly in SAFARI and CHROME.

But I must click back in the browser for it to work...

SEE THIS QUESTION FOR FURTHER INFORMATION: http://stackoverflow.com/questions/3849643/cant-figure-out-why-chrome-safari-cant-get-the-scrollheight-right-here-advice

A: 

I am not sure but however I want to say what I want say. Safari and Chrome both webkit based browsers so its normal to behaviour like that. So I guess that they calculating the height adding padding and margin to normal height. please google it "webkit calculated style"

Lorenzo