iframe inside div height fixed

I have been looking for an answer to this for 2 days I read and tried several things so far.(CSS HTML newbie)

I have a div with a height=485px and I want to put an iframe inside with a width of 100% so the user can scroll the div not the scrollbar (Im doing this because I'm using a CSS scrollbar)

<div id="demo1"  style="height:485px; overflow:scroll;float: left;overflow-x: hidden;">
<iframe height="100%" width="455px"  scrolling="no" frameborder="0" src="www" ></iframe>
</div>

I tried to include style to the iframe like style="height: auto;" or 100% but doesn't work.

Any suggestion how to check the height of the iframe? Thanks


To get the height on an iframe, you'll need to communicate between two window. If you only support IE8+, then that's rather simple with postmessage . You basically use a script inside the iframe (1- the iframe content is owned by you and you add the script, or the owner of the iframe trust you and add your code snippet).

If you want to support older browser, then you'll have a lot of fun breaking the cross domain barrier .

But, that's really the only way you can get the inner height of an iframe.

I'm not sure I've quite understand your use case here, but what it seemed like to me, is that you're loading a complete website in an iframe in order to use some special scrolling effect? If that's really the case, seriously look at other solution, messing around with cross domain communication to get a simple visual effect isn't the best use of time (plus the performance hit of nesting a complete website iframe).

Hope this help!

链接地址: http://www.djcxy.com/p/88266.html

上一篇: 等于100%的高度对IFrame不起作用

下一篇: 内部div高度固定的iframe