zoukankan      html  css  js  c++  java
  • iframe 随内容自适应高度

    兼容性好的

    html代码:

    <iframe src="enterprise/enter_edit.aspx" id="mainframe" frameborder="0" name="main"
                            onload="resize()" onreadystatechange="resize()" style=" 100%; height: 100%;" border="0"></iframe>

    JS代码:

    <script type="text/javascript">
            //iframe自适应高度的函数
            var oTime = null;
            function resize() {
                if (oTime) {
                    clearTimeout(oTime);
                }
                oTime = setTimeout(reset, 0);
            }
    
            //iframe自适应高度的函数
            function reset() {
                var frame = document.getElementById("mainframe");
                var outHeight = frame.offsetHeight;
                var inHeight = frame.contentWindow.document.body.scrollHeight;
                if (outHeight < inHeight) {
                    frame.style.height = (inHeight + 10) + "px";
                } else if (inHeight > 650) {
                    frame.style.height = (inHeight + 10) + "px";
                } else {
                    frame.style.height = "750px";
                }
            }
        </script>

    jquery代码:

    <script type="text/javascript">
        //iframe 随内容自适高度
            $("#mainframe").load(function () {
                var mainheight = $(this).contents().find("body").height() + 30;
                $(this).height(mainheight);
            });
        </script>
  • 相关阅读:
    SpringRequestContext源码阅读
    MyBatis事务管理源码阅读
    linux查找依赖文件
    GitHub
    Qt Quick
    centos7下安装chrome
    软件使用
    排序算法之冒泡排序
    c++学习
    cent6.4使用
  • 原文地址:https://www.cnblogs.com/pingming/p/4274838.html
Copyright © 2011-2022 走看看