Geek Answers Handbook

Dynamically adjust iframe height

I have an iframe that contains some content from the site. I want the iframe to be set to 100% of the height of the src content. The noob bit in js is what i'm working with:

<iframe id="frame" scrolling="no" frameborder="0" src="http://www.srcwebsite.org"></iframe> <script type="text/javascript"> function resizeIframe() { var height = document.documentElement.clientHeight; height -= document.getElementById('frame').offsetTop; height -= 20; /* whatever you set your body bottom margin/padding to be */ document.getElementById('frame').style.height = height +"px"; }; document.getElementById('frame').onload = resizeIframe; window.onresize = resizeIframe; </script>

This is great for resizing an iframe on his page, but I want it to resize it to src height ...

+4
source share
1 answer

You cannot access the height of the iframe content due to the Same origin policy (protocol, domain and ports must match).

You can configure CORS , keep in mind that it is not supported in IE until IE8.

+3
source

More articles:


All Articles