动态调整Iframe以适应内容（仅同域）代码,Js代码库,德仔网

代码语言

代码分类

【Js】动态调整Iframe以适应内容（仅同域）

作者: / 发布于2016/9/29/ 848

通常情况下，您设置和宽度Iframe和高度。如果里面的内容比较大，滚动就够了。下面的脚本试图修复，动态调整iframe来适应它加载的内容。

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：
<iframe src="content.html" class="iframe" scrolling="no" frameborder="0"></iframe>

试试其它关键字

同语言下

可能有用的

贡献的其它代码Label