我想让一个'iframe'占据尽可能多的垂直空间以显示其内容而不显示滚动条。有可能吗？

有什么解决方法吗？

解决方案

回答

此CSS代码段应删除垂直滚动条：

body {
  overflow-x: hidden;
  overflow-y: hidden;
}

我不确定它是否会占用所需的垂直空间，但我会看看是否能解决。

回答

这应该将IFRAME的高度设置为其内容的高度：

<script type="text/javascript">
the_height = document.getElementById('the_iframe').contentWindow.document.body.scrollHeight;
document.getElementById('the_iframe').height = the_height;
</script>

我们可能想在IFRAME中添加scrolling =" no"以关闭滚动条。

编辑：糟糕，忘记声明the_height。

回答

在IFRAME源文件中添加DOCTYPE声明将有助于从该行计算正确的值

document.getElementById('the_iframe').contentWindow.document.body.scrollHeight

有关示例，请参见W3C DOCTYPE

IE和FF都存在问题，因为它以"怪癖"模式呈现" iframe"文档，直到我添加了" DOCTYPE"。

FF / IE / Chrome支持：.scrollHeight无法与Chrome一起使用，因此我想出了一个使用jQuery的javascript示例，用于根据iframe内容设置页面上的所有" IFRAME"高度。注意：这是我们当前域中的参考页面。

<script type="text/javascript">
    $(document).ready(function(){
        $('iframe').each(function(){
            var context = $(this);
            context.load(function(event){ // attach the onload event to the iframe  
                var body = $(this.contentWindow.document).find('body');
                if (body.length > 0 && $(body).find('*').length > 0) { // check if iframe has contents
                    context.height($(body.get(0)).height() + 20);
                } else {
                    context.hide(); // hide iframes with no contents
                }
            });
        });
    });
</script>

回答

解决方法是不要在服务器端使用<iframe>和预处理代码。

回答

还请检查以下线程：DiggBar如何根据不在其域上的内容来动态调整其iframe的高度？

它解决了同样的问题。