• [转自沪江博客tangle's blog]iframe框架高度自适应的实现


    解决iframe框架页面自适应高度问题代码如下,需要注意的是框架引用页面一定要设置name属性,否则会不生效
    <iframe src="test.asp" width="100%" frameborder="0" scrolling="no" name="hj" id="hj"></iframe>

    test.asp页面head间增加如下JS代码

    <SCRIPT LANGUAGE="JavaScript">

    function f_frameStyleResize(targObj){

     
    var targWin = targObj.parent.document.all[targObj.name];

     
    if(targWin != null) {

      
    var HeightValue = targObj.document.body.scrollHeight

      
    if(HeightValue < 600){HeightValue = 600

      targWin.style.pixelHeight 
    = HeightValue;

     }

    }

    function f_iframeResize(){

     bLoadComplete 
    = true; f_frameStyleResize(self);

    }

    var bLoadComplete = false;

    window.onload 
    = f_iframeResize;

    </SCRIPT> 

    在主页面增加如下JS代码

    <script type="text/javascript">
     
    var iframeids=["myblog"]
     
    var iframehide="yes"
     
    function dyniframesize() 
     {
      
    var dyniframe=new Array()
      
    for (i=0; i<iframeids.length; i++)
      {
       
    if (document.getElementById)
       {
        dyniframe[dyniframe.length] 
    = document.getElementById(iframeids[i]);
        
    if (dyniframe[i] && !window.opera)
        {
         dyniframe[i].style.display
    ="block"
         
    if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight)
          dyniframe[i].height 
    = dyniframe[i].contentDocument.body.offsetHeight; 
         
    else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight)
          dyniframe[i].height 
    = dyniframe[i].Document.body.scrollHeight;
        }
       }
       
    if ((document.all || document.getElementById) && iframehide=="no")
       {
        
    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
        tempobj.style.display
    ="block"
       }
      }
     }

     
    if (window.addEventListener)
     window.addEventListener(
    "load", dyniframesize, false)
     
    else if (window.attachEvent)
     window.attachEvent(
    "onload", dyniframesize)
     
    else
     window.onload
    =dyniframesize

    </script>


    把主页面的大表格高度去掉
    子页面的固定高度也去掉

  • 相关阅读:
    简单所以不要忽视,关于 和 程序员应了解的实际应用
    即使用ADO.NET,也要轻量级动态生成更新SQL,比Ormlite性能更高
    即使用ADO.NET,也要轻量级实体映射,比Dapper和Ormlite均快
    如何在前端实现语义缩放(第一步)
    react教程 — 性能优化
    react教程 — 组件
    react教程 — redux
    create-react-app 创建项目 及 配置
    CSS 预处理器
    react 和 vue 对比
  • 原文地址:https://www.cnblogs.com/wildfish/p/180070.html
Copyright © 2020-2023  润新知