不带边框的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. bzoj 3275: Number (最小割)

    题目的意思是要选一些数,但是这些数如果满足两个条件的话就不能一起被选. type arr=record toward,next,cap:longint; end; const maxn=; maxm= ...

  2. BZOJ1877:[SDOI2009]晨跑——题解

    http://www.lydsy.com/JudgeOnline/problem.php?id=1877 https://www.luogu.org/problemnew/show/P2153 Ela ...

  3. 洛谷 P1338 末日的传说 解题报告

    P1338 末日的传说 题目描述 只要是参加jsoi活动的同学一定都听说过Hanoi塔的传说:三根柱子上的金片每天被移动一次,当所有的金片都被移完之后,世界末日也就随之降临了. 在古老东方的幻想乡,人 ...

  4. BZOJ1491 洛谷2047 NOI2007 社交网络

    Description: 在社交网络(social network)的研究中,我们常常使用图论概念去解释一些社会现象.不妨看这样的一个问题.在一个社交圈子里有n个人,人与人之间有不同程度的关系.我 们 ...

  5. 搭建openresty需要注意到的地方

    openresty的完整包放在百度云盘linux目录下 一键安装openresty ./install.sh 安装好后,修改nginx.conf配置文件 cd /usr/local/openresty ...

  6. CCPC-Winter Camp div2 day5

    DIV2 有部分div1的题会写 div1的大佬真的太强了 向他们学习 (好像和zqc大佬说过话了hhh,zqc大佬真的是一个超有意思的人啊,羡慕有妹子队友的zqc大佬) A: 你有一棵树,你想把它画 ...

  7. Eureka与zookeeper

    Eureka的优势 1.在Eureka平台中,如果某台服务器宕机,Eureka不会有类似于ZooKeeper的选举leader的过程:客户端请求会自动切换到新的Eureka节点:当宕机的服务器重新恢复 ...

  8. bzoj1178 [Apio2009]CONVENTION会议中心 区间dp+贪心

    [Apio2009]CONVENTION会议中心 Time Limit: 15 Sec  Memory Limit: 162 MBSubmit: 1130  Solved: 444[Submit][S ...

  9. struts2常用标签之数据标签

    数据标签1  property标签  property标签的主要属性:  value:用来获取值的OGNL表达式,如果value属性值没有指定,那么将会被设定为top,也就是返回位于值栈最顶端的对象. ...

  10. 两台linux服务器之间免密scp,在A机器上向B远程拷贝文件

    两台linux服务器之间免密scp,在A机器上向B远程拷贝文件 操作步骤:1.在A机器上,执行ssh-keygen -t rsa,一路按Enter,不需要输入任何内容.(如有提示是否覆盖,可输入y后按 ...