Dav*_*vid 8 css iframe firefox height
我在弄清楚如何在Firefox和IE中将iframe扩展到100%的容器元素时遇到了一些麻烦(它在Chrome中运行良好).从搜索周围,有必要在包含div(也可能是body和html)上指定高度.但是,我已经这样做了,iframe仍未扩展.是否所有父div都必须具有指定的高度和位置才能使其工作,或仅包含父级?对此的任何修复将不胜感激!
这就是我所拥有的:
<!DOCTYPE html>
<html>
<head>
<style>
html, body {margin:0; padding:0; height:100%}
#container {width: 1000px; min-height: 550px; position: relative}
#smallContainer {position:relative} /*no height specified*/
#iframeContainer {height: 100%; position: relative}
#iframe {height: 100%; width: 100%; display: block}
</style>
</head>
<body>
<div id="container">
<div id="smallContainer">
<div id="iframeContainer">
<iframe id="iframe" src="foo.com"></iframe>
</div>
</div>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
您可能需要组合..
$(function(){
var height = window.innerHeight;
$('iframe').css('height', height);
});
//And if the outer div has no set specific height set..
$(window).resize(function(){
var height = window.innerHeight;
$('iframe').css('height', height);
});
Run Code Online (Sandbox Code Playgroud)
试试这个 Jquery 脚本
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
var height = window.innerHeight;
$(document).ready( function(){
$('iframe').css('height', height)
} );
</script>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
40754 次 |
| 最近记录: |