【开发过程问题汇总系列】【iframe自适应高度】兼容 FireFox和IE内核的浏览器

iframe自适应高度

1.问题现象

        做项目的过程中js控制iframe的场景大量存在，今天在开发过程中遇到了此问题，故此记录解决方法。

       在iframe中设置了高度为100% <iframe  height="100%"></iframe> ， 此方法在IE内核的浏览器中显示内容页面没问题，但在FireFox中完全没反应。

 

2.解决方案

        使用js控制，获得iframe的内容对象，再获得当前页面内容对象，如果两个对象都能获取到，则设置iframe内容对象的高度为页面内容对象的滚动条高度。

         在iframe的onload方法中调用此函数就ok了。

                    function initIframeHeight() {
                        var frame = document.getElementById(“Iframe的ID”);

                         var pageDoc;

                        if (document.frames) {

                               pageDoc = frame.document;

                        } else {

                               pageDoc = frame.contentDocument;

                        }