不带边框的iframe因为能和网页无缝的结合从而不刷新新页面的情况下实现更新页面部分的数据成为可能,可是iframe却不像层那样可以收缩自如,iframe高度需要动态的调整需要JS来配合使用,只能通过JS动态的来赋给他高度。

function SetWinHeight(obj)
{
  var win=obj;
  if (document.getElementById)
  {
    if (win && !window.opera)
    {
      if (win.contentDocument && win.contentDocument.body.offsetHeight)
        win.height = win.contentDocument.body.offsetHeight;
      else if(win.Document && win.Document.body.scrollHeight)
        win.height = win.Document.body.scrollHeight;
    }
  }

}

<iframe width="778" align="center" height="200" id="win" name="win" onload="Javascript:SetWinHeight(this)" frameborder="0" scrolling="no" src="1.htm"></iframe>

或者:

<script language="javascript" type="text/javascript">
  function dyniframesize(down) {
    var pTar = null;
    if (document.getElementById){
    pTar = document.getElementById(down);
  }
  else{
    eval('pTar = ' + down + ';');
  }
  if (pTar && !window.opera){
    //begin resizing iframe
  pTar.style.display="block"
  if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight){
  //ns6 syntax
    pTar.height = pTar.contentDocument.body.offsetHeight +20;
    pTar.width = pTar.contentDocument.body.scrollWidth+20;
  }
  else if (pTar.Document && pTar.Document.body.scrollHeight){
    //ie5+ syntax
    pTar.height = pTar.Document.body.scrollHeight;
    pTar.width = pTar.Document.body.scrollWidth;
  }
  }
}
</script>
<iframe
src ="/default2.aspx" frameborder="0" marginheight="0" marginwidth="0"
frameborder="0" scrolling="auto" id="ifm" name="ifm"
onload="javascript:dyniframesize('ifm');" width="100%">
</iframe>

iframe自适应高度的方法的更多相关文章

  1. Iframe 自适应高度的方法!

    第一种方法:代码简单,兼容性还可以,大家可以先测试下. function SetWinHeight(obj) { var win=obj; if (document.getElementById) { ...

  2. iframe自适应高度解决方法 .

    <div id="leftBar"> <iframe name="tag" src="_iframe.html" styl ...

  3. 让iframe自适应高度-真正解决

    需求:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象. (需要只有iframe出现滚动条) 本人一开始这么写:会造成只有主页面加载是设定 ...

  4. [转]让iframe自适应高度-真正解决

    原文地址:https://www.cnblogs.com/rogge7/p/7762052.html 需求:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同 ...

  5. iframe自适应高度的多种方法小结

    转自:http://www.jb51.net/article/15780.htm 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的大小 ...

  6. iframe自适应高度的多种方法方法小结

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的  不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 ifram ...

  7. iframe自适应高度的多种方法方法小结(转)

    对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的 ...

  8. 【前端开发】前端引入公共部分footer header的几种方法,及iframe自适应高度js

    一.引入页面几种方法   1.IFrame引入,看看下面的代码    <iframe   frameborder=0   border=0   width=300   height=300    ...

  9. 真正的让iframe自适应高度 兼容多种浏览器随着窗口大小改变

    今天有朋友问到我关于"iframe自适应高度"的问题,原本以为是很简单的问题,没想到折腾了20分钟才搞定.期间遇到几个问题,要么是高度自适应了,但是当窗口改变时会出现滚动条.也就是 ...

随机推荐

  1. tcpdump抓取ftp密码

    步骤: 1.登陆ftp服务器,执行命令: tcpdump -i wlan0 -w password.bin -c 500 port 21 2.有人登陆后,执行: tcpdump -v -XX -r p ...

  2. Hadoop Yarn事件处理框架源码分析

    由于想在项目中使用类似yarn的事件处理机制,就看了实现.主要是由Dispatcher.java,EventHandler.java,Service.java这3个类撑起来的. 在事件处理之前,先注册 ...

  3. Mybatis中传入List条件

    传入一个map的参数,map里有一个tenantIds的List,在xml里先判断这个List的size是否大于o,然后通过foreach 构造一个in后面括号里的元素,具体的xml如下: <i ...

  4. [LeetCode] 17. Letter Combinations of a Phone Number ☆☆

    Given a digit string, return all possible letter combinations that the number could represent. A map ...

  5. 图书馆排序(Library Sort)

    思路简介,大概意思是说,排列图书时,如果在每本书之间留一定的空隙,那么在进行插入时就有可能会少移动一些书,说白了就是在插入排序的基础上,给书与书之间留一定的空隙,这个空隙越大,需要移动的书就越少,这是 ...

  6. 元类编程-- metaclass

    #类也是对象,type创建类的类 def create_class(name): if name == "user": class User: def __str__(self): ...

  7. 解决gitlab关闭登录选项问题

    1.连接资料库      mysql -uroot -p   2.use gitlabhq_production; 3.进入后,输入下面语句UPDATE application_settings se ...

  8. 启动hbase输出ignoring option PermSize=128m; support was removed in 8.0告警信息

    ./start-hbase.sh starting master, logging to /home/hadoop/hbase-1.2.4/bin/../logs/hbase-hadoop-maste ...

  9. Eclipse中 将java Gradle项目转换为web项目

    1.找到项目工作空间目录,打开.project文件,并修改文件, 修改如下:      找到:<natures> </natures>代码段,在代码段中加入如下内容并保存:   ...

  10. Fermat2018游记

    day (-22) 2018年2月5日 Devin大佬给我发了一份Waterloo AIF的原件截图,发现里面居然直接问你的Fermat分数,那么这么重要的考试当然不能错过啊 若干天之后刚开学不久的一 ...