`
dyclh
  • 浏览: 50906 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

兼容IE和火狐的iframe 高度自动调整

阅读更多

<script type="text/javascript">
 function SetCwinHeight(){
  var iframemain=document.getElementById("iframemain"); //iframe id
  if (document.getElementById){
   if (iframemain && !window.opera){
    if (iframemain.contentDocument && iframemain.contentDocument.body.offsetHeight){
  alert( iframemain.contentDocument.body.offsetHeight)
  iframemain.height = iframemain.contentDocument.body.offsetHeight;
    }else if(iframemain.Document && iframemain.Document.body.scrollHeight){
   iframemain.height = iframemain.Document.body.scrollHeight;
    }
   }
  }
 }
</script>
<a href="sd.html" target="iframemain">baidu</a>----
<a href="text.html" target="iframemain">qq</a>------
<a href="ddd.html" target="iframemain">dddd</a>------

<br>
<iframe width="100%"  id="iframemain" name="iframemain" onload="Javascript:SetCwinHeight()" scrolling="no" height="1" frameborder="0" src="text.html"></iframe>

 

 

新建几个页面,静态的,用内容把高度调一下,点击链接就可以实现火狐的高度自适应了,网上例子挺多的。

分享到:
评论

相关推荐

    Iframe高度自适应(兼容IE/Firefox、同域/跨域)

    "Iframe高度自适应(兼容IE/Firefox、同域/跨域)"这一主题是关于如何让内嵌在Iframe中的页面能够根据其内容动态调整自身的高度,确保在不同浏览器(如IE和Firefox)以及处理同域和跨域情况时都能正常显示。...

    iframe和firefox的兼容。

    然而,不同的浏览器对于`iframe`的支持程度和处理方式可能存在差异,尤其是在较早版本的Firefox中,可能会遇到一些兼容性问题。本篇文章将详细探讨`iframe`在Firefox中的兼容性挑战及其解决方案。 1. **Firefox对...

    iFrame高度自适应终极解决方案(兼容IE7,8,9 Firefox3.6+,Chrome 12+)

    "iFrame高度自适应终极解决方案(兼容IE7,8,9 Firefox3.6+,Chrome 12+)"这个标题所指向的,就是一种跨浏览器的策略,确保iFrame内容无论何时更新,都能自动调整其高度,从而避免滚动条的出现和内容溢出。...

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

    因为有一个项目要用到iframe自适应高度,网上搜索了以下结果无数,不过看来看去都是那...iframe自适应高度,亲测完美兼容IE6_7_8_9,Chrome谷歌浏览器,Opera欧朋浏览器,FireFox火狐浏览器,Mac Safari浏览器等五大浏览器

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

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

    兼容IE和Firefox的Html在线编辑器!

    本篇文章将深入探讨如何创建一个兼容IE和Firefox的Html在线编辑器,并涵盖相关的核心知识点。 首先,我们需要理解HTML的基础。HTML(HyperText Markup Language)是网页内容的结构化语言,用于定义页面的结构和内容...

    javascript在IE和Firefox中兼容性问题

    本篇将主要探讨JavaScript在Internet Explorer (IE) 和Firefox之间的兼容性挑战,并通过给出的文件名列表解析这些测试用例所涉及的知识点。 1. **createDocument测试.html** 在IE和Firefox中,创建XML文档的方法...

    解决IE,Firefox,chrome,safari浏览器中iframe显示高度自适应问题

    例如,在IE6中,`iframe`能够正常显示,但在其他浏览器如Firefox、Chrome和Safari中,可能出现高度过小或过大,无法正确反映`iframe`内部内容的实际高度。这不仅影响用户体验,还可能破坏网页的整体布局。 #### ...

    自动改变iframe的高度

    因此,让`iframe`能够自动调整高度变得尤为重要。 #### 三、解决方案 接下来,我们将介绍一种简单有效的方法来实现`iframe`自动改变高度。该方法适用于现代浏览器,包括Chrome、Firefox、Safari等。 **核心代码...

    Iframe 高度自适应,js控制Iframe 高度自适应.docx

    Iframe 高度自适应是指在网页中嵌入的 iframe 元素能够根据其内容自动调整高度,以适应不同的浏览器和屏幕尺寸。js 控制 Iframe 高度自适应是指使用 JavaScript 语言来控制 iframe 的高度,使其能够自动调整以适应...

    JQuery IFrame框架高度自适应(支持嵌套–兼容IE,ff,safafi,chrome)

    通过使用jQuery来实现iframe的高度自适应,我们可以确保内容在不同浏览器(包括IE、Firefox、Safari和Chrome)中的显示一致性,无论iframe内嵌的页面有多复杂。 首先,我们需要理解iframe的基本概念。IFrame,即...

    iframe高度自适应,多浏览器兼容

    为了让`iframe`的内容自动填充其容器,我们需要动态调整`iframe`的高度。一种常见方法是使用JavaScript来实现,通过获取`iframe`内容的实际高度并设置给`iframe`本身。以下是一个简单的实现示例: ```javascript ...

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

    例如,IE浏览器需要特殊处理其边框和滚动条的高度,而Firefox浏览器需要对其高度进行特殊计算。 知识点4:JavaScript的事件处理 在实现iFrame的高度自适应时,需要使用JavaScript的事件处理来监听iFrame的加载事件...

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

    下面是一个完整的示例代码片段,展示了如何在页面加载完成及窗口大小变化时自动调整`iframe`的高度。 ```html &lt;!DOCTYPE html&gt; &lt;title&gt;iframe自适应高度示例 #iframepage { width: 100%; border: none; ...

    完整可行、浏览器兼容、通过测试的Iframe高度自适应程序

    本项目提供了一个完整的、经过测试的解决方案,确保在IE6到IE8、Firefox 3.5、Opera以及Google Chrome等主要浏览器中,Iframe的内容能自动调整其高度以适应内部页面的大小。 1. **Iframe高度自适应原理** - 通常,...

    Iframe 高度自适应(兼容IE/Firefox、同域/跨域)

    这种方法的关键在于通过 JavaScript 获得 Iframe 内页面的实际高度,并且根据这个高度动态地调整 Iframe 的 height 属性。 在同域情况下的 Iframe 高度自适应实现代码中,我们定义了一个 JavaScript 函数 `...

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

    实现iframe自适应高度时,必须考虑到不同浏览器之间的差异,包括但不限于IE、Chrome、Firefox、Safari等。这是因为不同的浏览器可能对iframe及其内容的渲染方式有所不同,从而可能影响到自适应高度的效果。因此,在...

    防止页面被iframe(兼容IE,Firefox火狐)

    这里是因为firefox windows.top如果没有那么就是空,在IE下windows.top就是本窗口 页面不断的刷新 不断的运行这段js代码这就造成了一个死循环,也是为什么页面一直在刷新. 所以我更改了方式,使用下面这段代码 兼容...

Global site tag (gtag.js) - Google Analytics