`
太阳神喻
  • 浏览: 107642 次
  • 性别: 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 自适应高度的解决方法

    iframe自适应高度兼容各主流浏览器

    iFrame自适应高度兼容各主流浏览器 iFrame自适应高度是指在网页中嵌入iFrame时，使其高度能够自动适应其内容的高度，从而避免了出现滚动条的问题。下面是实现iFrame自适应高度的方法和相关知识点。 知识点1：...

    jquery对iframe自适应高度插件

    为了解决这个问题，`jQuery`提供了一个专门的插件——"jquery对iframe自适应高度插件"。 这个插件是专门为了解决`iframe`高度自适应的问题而设计的，它允许`iframe`根据其内部内容自动调整高度，确保用户无需滚动就...

    iframe自适应高度（兼容目前所有主浏览器)

    iFrame 自适应高度（兼容所有主浏览器） iFrame 自适应高度是前端开发中常见的问题，很多开发者在搜索引擎中搜索相关解决方案，但大多数文章只能解决静态高度的问题，而忽视了 JS 操作 DOM 之后的动态同步问题。...

    iframe内容高度 iframe自适应高度终极解决Iframe设置高度后无法缩小问题

    然而，`&lt;iframe&gt;`的高度自适应问题常常困扰着开发者，尤其是当`&lt;iframe&gt;`内部的内容动态加载或者变化时，如何让`&lt;iframe&gt;`自动调整其高度以适应内容，而不会导致滚动条溢出或内容被截断，成为了一个常见需求。...

    基于jquery的兼容各种浏览器的iframe自适应高度的脚本

    在探讨“基于jQuery的兼容各种浏览器的iframe自适应高度的脚本”这一主题时，我们首先需要理解几个关键概念：iframe、自适应高度以及jQuery。 ### 1. iframe概述 iframe，即Inline Frame，是HTML中一个用于在当前...

    iframe自适应高度，亲测完美兼容IE6-9,Chrome,Opera,firefox,safari

    因为有一个项目要用到iframe自适应高度，网上搜索了以下结果无数，不过看来看去都是那几个，而且基本都测试了一遍，所说的兼容根本不是那么回事，要不IE不正常，要不其他浏览器显示不正常，最后无奈，综合网上的方法...

    iframe自适应高度说明文档

    ### iframe自适应高度详解 在网页开发中，`iframe`是一种常用的技术，用于在一个HTML页面中嵌入另一个HTML页面。然而，默认情况下，`iframe`的高度是固定的，这可能导致页面布局问题，尤其是当嵌入的内容高度不确定...

    iframe自适应高度的简单解决办法

    在网页设计中，`iframe`（Inline Frame）是一种嵌入其他网页或内容的标签，它允许我们在一个页面中展示多...通过下载提供的`iframe自适应高度.doc`文档，你可以得到更详细的步骤和解释，以便更好地理解和应用这些技术。

    iframe自动适应高度（完美自适应高度嵌套代码），兼容目前主流浏览器。

    标题提到的“iframe自动适应高度（完美自适应高度嵌套代码）”提供了一个解决方案，它能够确保`iframe`在各种主流浏览器中都能正确地自适应内容高度，包括360浏览器、IE6-9、遨游、火狐以及搜狗浏览器。 在传统的`...

    iframe自适应高度（DOM动态操作）

    ### iframe自适应高度（DOM动态操作） #### 概述 在网页开发中，`iframe`是一种常用的技术，用于在一个HTML页面中嵌入另一个HTML页面。然而，在实际应用中经常会遇到一个问题：即`iframe`的高度与内嵌页面的实际...

    iframe自适应宽高

    这个库允许的高度与同跨域iframe来适应他们所包含的内容的宽度自动调整大小。它最常见的问题与使用iframes提供一系列的功能，其中包括： 高度和宽度大小的iframe内容大小。 作品以多个嵌套的iframe。 跨域iframe域...

    js实现iframe自适应高度

    本文将详细讲解如何使用JavaScript实现`iframe`自适应高度的解决方案，确保在各种主流浏览器中都能正常工作。 首先，理解`iframe`的基本结构和属性是至关重要的。`iframe`标签通常包含`src`属性，用于指定要加载的...

    iframe自适应高度 .txt

    ### iframe自适应高度知识点详解 #### 一、概述 在网页设计与开发中，`&lt;iframe&gt;`（Inline Frame）是一种常用的HTML元素，用于在当前页面内嵌入另一个HTML文档。随着响应式设计的需求日益增加，如何使`&lt;iframe&gt;`内...

    iframe自适应高度 .doc

    【iframe自适应高度】是指在网页中使用`&lt;iframe&gt;`元素时，为了保持页面美观和良好的用户体验，隐藏边框和滚动条，使`iframe`高度根据内部内容自动调整。这通常发生在`iframe`需要加载不同页面或内容进行DOM动态操作...

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