iframe宽高自适应

Posted zhoushiya

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了iframe宽高自适应相关的知识,希望对你有一定的参考价值。

iframe子页面结尾添加本script

 

iframe子页面结尾添加本script

<script type="text/javascript">
        function iframeAuto() {
            try {
                if (window != parent) {
                    //定位需要调整的frame框架(在父级窗口中查找)
                    var a = parent.document.getElementsByTagName("iframe");
                    for (var i = 0; i < a.length; i++) {
                        if (a[i].contentWindow == window) {
                            var h1 = 0, h2 = 0;
                            a[i].parentNode.style.height = a[i].offsetHeight + "px";
                            a[i].style.height = "10px"; //首先设置高度为10px,后面会修改
                            if (document.documentElement && document.documentElement.scrollHeight) {
                                h1 = document.documentElement.scrollHeight;
                            }
                            if (document.body) h2 = document.body.scrollHeight;
                            var h = Math.max(h1, h2); //取两者中的较大值
                            if (document.all) { h += 4; }
                            if (window.opera) { h += 1; }
                            //调整框架的大小
                            a[i].style.height = a[i].parentNode.style.height = h + "px";
                        }
                    }
                }
            }
            catch (ex) { }
        }
        //事件绑定的方法,支持IE5以上版本
        if (window.attachEvent) {
            window.attachEvent("onload", iframeAuto);
        }
        else if (window.addEventListener) {
            window.addEventListener(‘load‘, iframeAuto, false);
        }
   
    </script>

  

以上是关于iframe宽高自适应的主要内容,如果未能解决你的问题,请参考以下文章

js实现 iframe 宽高自适应

怎样让iframe中的内容的宽度和高度改变后,dialog的宽高自适应?

宽高自适应

swift 字体自适应,宽高自适应

宽高自适应,高度塌陷,伪对象选择符

css宽高自适应