`
shirlly
  • 浏览: 1644301 次
  • 性别: Icon_minigender_2
  • 来自: 福州
社区版块
存档分类
最新评论

根据页面的内容,动态设置iframe的高度使其不出现滚动条

阅读更多
<iframe id="treeFrame" name="treeFrame" frameborder="0" scrolling="0" width="100%" src="Tree.jsp">
<iframe id="contentFrame" name="contentFrame" frameborder="0" scrolling="0" width="100%" src="content.jsp" stype="height:expression(1);aho:expression(autoResize())">
<script type="text/javascript">
function autoResize()
{
   try{
      var hr = contentFrame.document.body.scrollHeight;
      var hl = treeFrame.document.body.scrollHeight;
      var height = Math.max(hr,hl);
      document.all["contentFrame"].style.height = height;
      document.all["treeFrame"].style.height = height;
   }
   catch(e){}
}
 
</script>
分享到:
评论

相关推荐

    自动调节iframe高度,而不显示其滚动条 js

    然而,当嵌入的内容高度不确定或者会动态变化时,如何让`iframe`的高度自适应其内容,并且不显示不必要的滚动条就成为了一个常见的需求。 #### 知识点解析 ##### 1. iframe元素简介 `iframe`(Inline Frame)是...

    外部滚动条控制iframe

    默认情况下,iframe具有自己的滚动条,当内容超出其可见区域时,内部的滚动条会自动出现。这种独立滚动行为是由`&lt;iframe&gt;`元素的`scrolling`属性决定的,该属性有三个可选值: - `auto`:浏览器自动决定是否显示...

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

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

    完全搞定iframe(框架)里的滚动条.doc

    2. **动态调整iframe的高度**:根据获取的高度动态地调整iframe的高度,确保内容能够完全展示,同时避免额外的滚动条出现。 #### 示例代码 以下是一个简单的示例,展示了如何使用JavaScript动态调整iframe的高度: ...

    iframe根据页面内容自适应高度和宽度

    然而,由于`iframe`的大小固定,当嵌入的页面内容高度或宽度超过`iframe`设定的尺寸时,可能会出现滚动条或者内容被截断的情况。为了解决这个问题,我们需要让`iframe`根据其内容自动调整高度和宽度。本篇文章将详细...

    javascript动态调整iframe高度

    有时候,`iframe`内容高度可能会超过实际容器高度,导致出现滚动条。我们可以通过设置`overflow`属性为`hidden`来隐藏滚动条。 ```javascript iframe.style.overflow = 'hidden'; ``` 6. 跨域通信 如若`iframe`...

    iframe高度自适应及隐藏滚动条的实例详解

    iframe高度自适应及隐藏滚动条的实例详解 在工作中,我们可能会遇到自己公司和其他的公司达成合作关系,从而共同开发某个项目。而这时候,我们可能就需要在自己的网站上嵌入别人做好的页面。而这种情况下,我们一般...

    iframe自适应高度(DOM动态操作)

    为了使`iframe`的高度能够自适应其内部内容的高度变化,我们需要动态地获取`iframe`内部文档的实际高度,并将这个值设置为`iframe`自身的高度。具体实现步骤如下: 1. **获取`iframe`元素**: - 使用`document....

    iframe自动适应高度(完美自适应高度嵌套代码),兼容目前主流浏览器。

    在传统的`iframe`使用中,如果内容超过`iframe`设定的高度,会出现滚动条,或者部分内容被隐藏,用户体验并不理想。为了解决这个问题,我们需要一种方法来动态地调整`iframe`的高度,使其与内容匹配。这种技术通常...

    iframe中页面显示不全1

    当遇到"Iframe中页面显示不全"的问题时,通常是由于iframe的尺寸设置不当或者与被嵌入内容的尺寸不匹配导致的。下面将详细探讨如何解决这一问题以及相关的知识点。 首先,我们需要了解`&lt;iframe&gt;`的基本结构和属性。...

    iframe高度自适应.pdf

    然而,一个常见的问题是当嵌入的内容高度变化时,如何使`iframe`的高度能够自适应地调整以适配其内容的高度。本文将详细介绍一种使用JavaScript实现`iframe`高度自适应的方法。 #### 技术背景 在默认情况下,`...

    iframe高度随子页高度变化

    当我们需要在`iframe`中展示的内容高度不固定时,一个常见的需求就是使`iframe`的高度能自动适应其内嵌页面的高度,以避免滚动条的出现或内容被截断。标题"iframe高度随子页高度变化"和描述中提到的问题,正是关注于...

    用javascript动态调整iframe高度的方法

    然而,当iframe内的内容高度发生变化时,如果没有正确处理,可能会出现滚动条、内容溢出或者被截断的问题。为了解决这个问题,我们可以利用JavaScript来动态调整iframe的高度,确保它始终适应其内部内容的大小。 在...

    js实现iframe自适应高度

    然而,`iframe` 的一个常见问题是其内容区域的高度可能超过其本身的显示区域,导致滚动条出现或者内容被截断。为了解决这个问题,我们需要让`iframe`能够自适应其内容的高度。本文将详细讲解如何使用JavaScript实现`...

    ext使用--Panel和iframe联合使用时页面高度的解决方法

    通过以上方法,我们可以确保Panel根据IFrame内容的高度动态调整,避免滚动条的出现或内容被裁剪。在实际应用中,应根据项目需求和兼容性考虑选择最适合的解决方案。同时,确保对IFrame的安全性进行充分考虑,防止跨...

    iframe实时高度检测

    "iframe实时高度检测"是解决了一个常见问题:当我们在一个页面中使用`iframe`展示其他内容时,如何确保`iframe`的内容能够完全显示,而不需要滚动条或者部分内容被裁剪。 ### 1. `iframe`的基本用法 `iframe`标签...

    iframe在IE6下出现横向滚动条的解决方案

    在某些情况下,这种方法可以使垂直滚动条出现,但是它有一个副作用,即在内容高度小于iframe高度时,滚动条仍然可见但不可用。 解决方案二:给内页加上样式`html{overflow-x:hidden;overflow-y:auto;}`。此方法试图...

    jsp页面iframe高度自适应的js代码.docx

    这种技术在实际应用中非常有用,例如在某些网页中,我们需要在 iframe 中嵌入一个内嵌页面,并且使其高度能够自动适应内容的高度,以免出现滚动条或空白区域。 在 jsp 页面中,我们可以使用 js 代码来实现 iframe ...

    再谈iframe自适应高度

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

Global site tag (gtag.js) - Google Analytics