`
太阳神喻
  • 浏览: 107730 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

iframe自适应高度

    博客分类：
  • css
ASPJavaScript 
阅读更多

在Iframe中显示内容时，如果内容不固定，那么就需要让Iframe来自动适应页面的高度，下面是几种方法：

1.在包含Iframe的页面：

<iframe src="main.asp" width="557px" height="100%" name="Mainv" id="Mainv" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" style="border:#FFFFFF" onload="this.height=this.contentWindow.document.body.scrollHeight"></iframe>

 

这样就可以了

2.在包含Iframe的页面：

<iframe src="main.asp" width="557px" height="100%" name="Mainv" id="Mainv" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" style="border:#FFFFFF"></iframe>

 

然后在每个要在Iframe中显示的页面上，

<body onload="parent.document.all.Mainv.height=getTotalHeight();">

 

然后在页面底部加入

<div id="theEnd" style="position:relative"></div>
<script language="JavaScript">
function getTotalHeight(){
return document.getElementById("theEnd").offsetTop+10;
}
</script>

 

分享到：
| CSS截取字符串省略号效果 兼容浏览器
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    iframe自适应高度(兼容多种浏览器)

    ### iframe自适应高度(兼容多种浏览器) 在网页开发过程中，`iframe`是一种常用的元素，用于在当前页面中嵌入另一个HTML文档。然而，默认情况下，`iframe`的高度是固定的，这可能会导致内容显示不完全或者出现不必要...

    iframe自适应高度.rar

    【标题】：“iframe自适应高度.rar”涉及到的关键知识点主要集中在如何使用JavaScript来处理网页中iframe元素的高度自适应问题。在Web开发中，iframe（Inline Frame）是一种内联框架，常用于在同一个HTML文档中嵌入...

    iframe 自适应高度

    ### iframe自适应高度实现方法详解 在网页设计与开发中，`iframe`（Inline Frame）是一种常用的HTML元素，用于在当前文档中嵌入另一个HTML文档。然而，在实际应用过程中，经常会遇到`iframe`内容高度固定导致页面...

    再谈iframe自适应高度

    "再谈iframe自适应高度"这个主题，关注的是如何使iframe的内容区域根据所加载页面的高度自动调整，以避免滚动条出现或者内容被截断的问题。在网页设计中，尤其是在构建响应式布局时，这是一个非常关键的优化点。 1....

    iframe自适应高度和宽度

    ### iframe自适应高度和宽度详解 在Web开发中，`iframe`（Inline Frame）是一种常用的HTML元素，用于在当前页面内嵌入另一个HTML文档。它能够实现页面内部局部刷新的效果，广泛应用于各种复杂的网页布局中。然而，...

    多层嵌套iframe 自适应高度的解决方法

    多层嵌套iframe 自适应高度的解决方法

Magicbox
Global site tag (gtag.js) - Google Analytics