zoukankan      html  css  js  c++  java
  • iframe高度自适应的IE解决方案

    主页面main.html 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
        
    <title>New Document </title>
    </head>
    <body>
        
    <style type="text/css">
            .iframestyle
            
    {
                height
    : expression(1);
                aho
    : expression(autoResize());
            
    }
        
    </style>

        
    <script type="text/javascript">
            
    function autoResize() {
                
    try {
                    document.getElementById(
    "frm1").style.height = window.frames["frm1"].document.body.scrollHeight;
                }
                
    catch (e) { }
            } 
        
    </script>

        iframe之前的文字
    <hr/>
        
    <iframe name="frm1" src='frm.html' marginwidth="0" marginheight="0" frameborder="0" scrolling="no" width="100%" class="iframestyle" id="frm1" ></iframe>
        
    <hr/>iframe之后的文字

    </body>
    </html>

     框架子页frm.html

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
        
    <title>New Document </title>
    </head>
    <body>

        
    <script language="JavaScript" type="text/javascript">
            
    function fnShort() {            
                document.getElementById(
    "diva").innerHTML = '<br />iframe变短<br />';

            }

            
    function fnLong() {

                document.getElementById(
    "diva").innerHTML = '<br />iframe变长<br />iframe变长<br />iframe变长<br />iframe变长<br />iframe变长<br />iframe变长<br />iframe变长<br />iframe变长<br />iframe变长<br />';

            } 
        
    </script>

        
    <href="#" onclick="fnShort();">iframe变短</a> <href="#" onclick="fnLong();">iframe变长</a>
        
    <div id="diva">
            
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
            iframe变长
    <br />
        
    </div>


        
    <href="frm2.html">转到一个新的页面</a>
    </body>
    </html>
    子页面2: frm2.html
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
        
    <title>New Document </title>
    </head>
    <body>

        
    <href="frm.html">返回frm.html</a>
    </body>
    </html>
    在IE8上失效(不过IE8上可以通过设置源代码的Meta,让IE8以兼容性视图浏览,也算是一种IE8下的解决办法)
    作者:菩提树下的杨过
    出处:http://yjmyzz.cnblogs.com
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
  • 相关阅读:
    hdu4549 M斐波那契数列(矩阵快速幂+费马小定理)
    E. 因数串(EOJ Monthly 2020.7 Sponsored by TuSimple)
    2019春总结作业
    大一下半年学期总结
    ball小游戏
    贪吃蛇
    链接远程仓库
    git自动上传脚本及基本代码
    模板 --游戏
    飞机小游戏
  • 原文地址:https://www.cnblogs.com/yjmyzz/p/1432952.html
Copyright © 2011-2022 走看看