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

    想到的一种办法是,在父页面里获取子页面的高度,在父页面onlod里把获取到子页面的高度赋值给父页面iframe标签,不过这种方法感觉不是很好,因为浏览器兼容性不好,获取不到高度

    这种方法有两种写法

    <script type="text/javascript">
      // 计算页面的实际高度,iframe自适应会用到
      function calcPageHeight(doc) {
          var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)
          var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)
          var height  = Math.max(cHeight, sHeight)
          return height
      }
      var ifr = document.getElementById('ifr')
      ifr.onload = function() {
          var iDoc = ifr.contentDocument || ifr.document
          var height = calcPageHeight(iDoc)
          ifr.style.height = height + 'px'
      }
    </script>
    <script>
        // 计算页面的实际高度,iframe自适应会用到
        function calcPageHeight(doc) {
            var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)
            var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)
            var height  = Math.max(cHeight, sHeight)
            return height
        }
        window.onload = function() {
            var height = calcPageHeight(document)
            parent.document.getElementById('ifr').style.height = height + 'px'     
        }
    </script>

    还有一种是兼容性比较好的

    <iframe src="http://www.fufuok.com/" id="iframepage" name="iframepage" frameBorder=0 scrolling=no width="100%" onLoad="iFrameHeight()" ></iframe>Javascript代码: 
    <script type="text/javascript" language="javascript"> 
    function iFrameHeight() { 
    var ifm= document.getElementById("iframepage"); 
    var subWeb = document.frames ? document.frames["iframepage"].document : ifm.contentDocument; 
    if(ifm != null && subWeb != null) { 
    ifm.height = subWeb.body.scrollHeight; 
    } 
    } 
    </script>
  • 相关阅读:
    Notes about "Exploring Expect"
    Reuse Sonar Checkstyle Violation Report for Custom Data Analysis
    Eclipse带参数调试的方法
    MIT Scheme Development on Ubuntu
    Manage Historical Snapshots in Sonarqube
    U盘自动弹出脚本
    hg的常用配置
    Java程序员的推荐阅读书籍
    使用shared memory 计算矩阵乘法 (其实并没有加速多少)
    CUDA 笔记
  • 原文地址:https://www.cnblogs.com/zxf100/p/10322564.html
Copyright © 2011-2022 走看看