zoukankan      html  css  js  c++  java
  • Frame框架高度问题

    法一:在子页面中写代码:

    假设主页面有一个div,里面放置一个iframe
    <div id="frameBox">
    <iframe id="frameWin" src="1.html" name="opWin" style="100%; height:100% " frameborder="0"  scrolling="no"></iframe>
    </div>
    3个菜单链接,分别在iframe加载 1.html、2.html、3.html 三个页面。

    3个子页面分别在自己页面加载完window.onload执行
    function aa(){  
           var newHeight = document.body.scrollHeight + 20 + "px";       
           window.parent.document.getElementById("frameBox").style.height = newHeight;
           //以上firefox通过,但是ie6必须加上下面这句,不然iframe高度是改了,但是可见区域没有改
           window.parent.document.getElementById("frameWin").style.height = newHeight;
    }

    法二,在主页面中写代码:

    觉得原来的方法不是很好


    • 每一个嵌进来的页面都要去修改
    • 占用了每一个嵌进来的页面的onload

    所以修改了一下,把函数放在了主页面,ie6、firefox2 通过,希望ie7的网友帮忙测试
    页面代码:
    <div style="border:1px solid #7e99c6" id="frameBox">
           <iframe id="frameWin" src="01.html" name="opWin" style="100%; height:100% " frameborder="0" scrolling="no" onload="test2()"></iframe>
    </div>

    js脚本(加在主页面):
    function test2(){
           var frameWin = document.getElementById("frameWin");
           var frameBox = document.getElementById("frameBox");
           var newHeight;
           if (frameWin.Document){
                  newHeight = frameWin.Document.body.scrollHeight + 20 + "px";
           }else{
                  newHeight = frameWin.contentDocument.body.scrollHeight+ 20 + "px";
           }
           frameWin.style.height = newHeight;
           frameBox.style.height = newHeight;
    }

  • 相关阅读:
    geoserver 地图性能和缓存
    geoserver PostGIS的安装和使用
    geoserver 数据图层输出格式
    Centos7Yum安装配置指定版本nginx
    Centos7Yum安装PHP7.2
    CentOS7 中把默认yum源更换成163源
    安装配置Elasticserch的方法
    redis的持久化(RDB&AOF的区别)
    LayerDate渲染多个class出现闪现问题的解决
    explain分析SQL语句详解
  • 原文地址:https://www.cnblogs.com/nianshi/p/1653144.html
Copyright © 2011-2022 走看看