Joh*_*ohn 7 html iframe height styles
有没有办法让高度<iframe>达到页面的底部?通过使用很难判断height:xx%,它可能依赖于浏览器.
代码如下:
<!DOCTYPE html>
<html>
<body style="margin:0">
<p style="margin:10px"> hello </p>
<iframe src="http://www.weather.com" style="width:100%; height:95%"></iframe>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
使用JavaScript/jQuery,您可以精确地为IFRAME元素设置正确的维度,而无需访问框架本身的DOM(跨域问题),依赖于表或绝对定位(如果框架上方的内容是动态的,则无用)身高):
$(function() {
var aboveHeight = $("#aboveFrame").outerHeight(true);
$(window).resize(function() {
$('#frame').height( $(window).height() - aboveHeight );
}).resize();
});
Run Code Online (Sandbox Code Playgroud)
示例:http://jsfiddle.net/hongaar/jsdYz/