如何让我的iframe填满窗口而不显示任何滚动条?
这适用于IE6,如果可能的话,我想让它适用于所有浏览器:
<iframe name=iframe1 src="theSiteToShow.html" width="100%" height="100%" frameborder="0" marginheight="10" marginwidth="10"></iframe>
<script type="text/javascript">
function resizeIframe() {
var height = document.documentElement.clientHeight;
height -= document.getElementById('frame').offsetTop;
// not sure how to get this dynamically
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>
答案 0 :(得分:21)
你应该只能使用CSS,而不需要javascript。以下适用于IE6 +,Google Chrome和Safari:
<style type="text/css">
body {
margin: 0;
overflow: hidden;
}
#iframe1 {
position:absolute;
left: 0px;
width: 100%;
top: 0px;
height: 100%;
}
</style>
<iframe id="iframe1" name="iframe1" frameborder="0"
src="theSiteToShow.html"></iframe>
您的边距应设置在theSiteToShow.html
的正文中。
<强>更新强>
在您发表评论之后,我将以下内容用作测试页面:
<html>
<head>
<style type="text/css">
body {
margin: 0;
overflow: hidden;
}
#iframe1 {
position:absolute;
left: 0px;
width: 100%;
top: 0px;
height: 100%;
}
</style>
</head>
<body>
<iframe id="iframe1" src="http://stackoverflow.com" frameborder="0"></iframe>
</body>
</html>
在IE6 +,Chrome,Safari和Firefox中测试过,它可以很好地工作并填满整个窗口。
答案 1 :(得分:0)
我遇到了滚动条以及无上下文菜单出现的相同问题,即使所有这些元素都已被禁用。经过几天尝试解决这些问题后,我偶然发现了这篇文章,这有点帮助,但是我带着三个代码示例找到了关于灵活网页播放器的帖子。这是链接:
http://virtualplayground.d2.pl/?p=367#comment-224
如果要使用空白工作表,请使用索引文件,替换导出的.html文件中的现有代码(来自Unity导出),将“unityObject.embedUnity”链接替换为您自己的.html文件链接位于您的服务器上。
使用iframe添加将播放器嵌入您的页面:
锁定并加载。
希望这会有所帮助。
^ _ ^