制作iframe需要垂直空间

问题描述：

我想要一个iframe需要尽可能多的垂直空间，因为它需要显示其内容并且不显示滚动条。这是否可能？制作iframe需要垂直空间

是否有任何解决方法？

答

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

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

您可能需要添加scrolling="no"您IFRAME关闭滚动条。

编辑：哎呀，忘了宣布the_height。

非常方便，欢呼声。值得一提的是，如果iframe由于相同的原始策略而位于不同的域上，这将无法很好地工作 – ConroyP 2008-10-16 09:32:44

答

这个CSS代码段应该删除垂直滚动条：

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

我还没有确定联系有关占用尽可能多的垂直空间，因为它需要的，但如果我不明白，我会看到出来。

答

添加DOCTYPE声明的IFRAME源文件将有助于从线

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

看到W3C DOCTYPE for examples

我与IE和FF问题计算正确的值，因为它是渲染iframe文档处于'怪癖'模式，直到我添加了DOCTYPE。

FF/IE/Chrome支持：.scrollHeight不适用于Chrome，因此我提出了一个使用jQuery的javascript示例，基于iframes内容在页面上设置所有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>

答

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

这并非总是可行，除非您要构建自定义代理服务器，以重写HTML身体...这是一个笑话。 – ErikE 2010-11-16 17:37:32

答

还检查出这个线程：How does the DiggBar dynamically resize its iframe's height based on content not on their domain?。

它解决了同样的问题。

制作iframe需要垂直空间

相关推荐