Chrome 扩展 - iFrame 自动高度答案

【问题标题】：Chrome Extension - iFrame auto-heightChrome 扩展 - iFrame 自动高度
【发布时间】：2013-09-18 18:07:04
【问题描述】：

我在我的 Google Chrome 扩展弹出窗口中创建了一个 iFrame 并应用了 CSS，因此它没有边框和高度：100%。

但是，它以有限的高度显示并显示垂直滚动条。

如何设置它以适应加载的 HTML 页面的高度？

【问题讨论】：

【解决方案1】：

这会起作用的，source here。

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
<script type='text/javascript'>

    $(function(){

        var iFrames = $('iframe');

        function iResize() {

            for (var i = 0, j = iFrames.length; i < j; i++) {
              iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
            }

            if ($.browser.safari || $.browser.opera) { 

               iFrames.load(function(){
                   setTimeout(iResize, 0);
               });

               for (var i = 0, j = iFrames.length; i < j; i++) {
                    var iSource = iFrames[i].src;
                    iFrames[i].src = '';
                    iFrames[i].src = iSource;
               }

            } else {
               iFrames.load(function() { 
                   this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
               });
            }

        });

</script>

【讨论】：

你把它放在 iframe 之前，对吧？另外，请确保它不会干扰任何其他脚本。
我已经这样做了，甚至在外部加载它（对于 Chrome 扩展是必需的）。
我不知道该说什么 - 它对我有用。这篇文章可能会有所帮助。stackoverflow.com/questions/5867985/iframe-auto-100-height?rq=1

【解决方案2】：

<body style="margin:0px;padding:0px;overflow:hidden">
    <iframe src="http://www.youraddress.com" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="100%" width="100%"></iframe>
</body>

【讨论】：