Chrome扩展程序 - iFrame自动高度

时间:2013-09-18 18:07:05

标签: css iframe google-chrome-extension

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

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

如何将其设置为调整到加载的HTML页面的高度?

2 个答案:

答案 0 :(得分: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>

答案 1 :(得分:0)

<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>