iframe resizing with scrollheight in chrome/safari

I'm trying to resize (make bigger or smaller) an iframe based on it's contents. After a click on each page a method is called which does the resizing.

In Chrome I can make the iframe bigger, but not smaller. document.body.scrollHeight is always the biggest value.

So if one big page sets #iframe.height = '620px', and someone clicks on a link to page with less content scrollHeight will remain at 620px instead of decreasing.

What's the proper way of handling this in Chrome/Safari?



Before you ask for the height of the document inside the iframe you should set the height of the iframe object to "auto". Something like this:

objIframe = document.getElementById('theIframeId');    
objIframe.style.height = 'auto';

And now:


returns the actual height of the document.


Did you try using document.documentElement.scrollHeight instead?


According to spec, Element.scrollHeight will round the value to an integer. If you need an accurate fractional value, use Element.getBoundingClientRect() instead.


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.