`
lengyue
  • 浏览: 144520 次
  • 性别: Icon_minigender_1
  • 来自: 长春
社区版块
存档分类
最新评论

使Iframe能够了根据内容自动伸缩

 
阅读更多

 1.在IE中一定要有以下代码

iframe自动伸缩时还要加上
<meta http-equiv="X-UA-Compatible" content="IE=7" />

2.然后实现下面的函数,在iframe的load时候调用
<script type="text/javascript">
var iframeids=["test"]
var iframehide="yes"
function dyniframesize()
{
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++)
{
if (document.getElementById)
{
dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);
if (dyniframe[i] && !window.opera)
{
dyniframe[i].style.display="block"
if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight)
dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;
else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight)
dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
}
}
if ((document.all || document.getElementById) && iframehide=="no")
{
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}

if (window.addEventListener)
window.addEventListener("load", dyniframesize, false)
else if (window.attachEvent)
window.attachEvent("onload", dyniframesize)
else
window.onload=dyniframesize
</script>


 

分享到:
评论

相关推荐

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

    为了解决这个问题,我们需要让`iframe`根据其内容自动调整高度和宽度。本篇文章将详细探讨如何实现`iframe`根据页面内容自适应高度和宽度。 首先,我们需要理解`iframe`的基本结构。一个简单的`iframe`标签如下: ...

    嵌入到HTML的iframe自动适应大小

    对于iframe而言,这意味着需要一种机制使其能够根据内部内容的变化或者外部容器的尺寸变化来自动调整自己的高度,从而避免出现滚动条或者内容被裁剪的情况。 ### 实现原理 自动调整iframe高度的核心在于监听页面...

    iFrame 自动调整高度

    这样`&lt;iframe&gt;`会根据内容自动扩展高度。 - 使用Grid布局: ```html ;"&gt; &lt;iframe id="iyxzl" src="your-url.html" style="grid-row: 1 / span 1;"&gt;&lt;/iframe&gt; ``` #### 六、总结 本文详细介绍了如何实现`...

    iframe显示全部内容代码

    为了确保`iframe`能够自动调整其高度以适应内部内容的大小,并且不显示滚动条,我们需要使用以下方法: 1. **动态调整高度**: 使用JavaScript监听`iframe`的加载事件,并根据其内部文档的实际高度来调整`iframe`...

    自动改变iframe的高度

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

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

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

    iframe 跨域 自动适应高度

    创建一个与父页面同源的代理页面,这个页面负责加载跨域的子页面并返回其高度,然后由父页面根据返回的高度设置`iframe`的高度。 - **JavaScript定时检测** 父页面每隔一定时间检测`iframe`的`contentDocument`...

    iframe高度自适应.pdf

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

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

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

    iframe自适应子页面内容高度

    这段代码首先获取`iframe`元素,然后检查其`contentWindow`和`contentWindow.document`是否可用,如果可用,就设置`iframe`的高度为子页面`document.body.scrollHeight`,这样`iframe`就会根据子页面的实际内容高度...

    iframe自动适应高度

    当`iframe`中的内容高度不确定时,我们希望`iframe`能自动调整其高度以完全显示内部内容,避免出现滚动条或者内容被截断的情况。以下是一些实现`iframe`高度自适应的方法: 1. **JavaScript解决方案**: - **...

    防止被IFRAME嵌套并自动跳到首页代码.rar

    3. 自动跳转:一旦发现页面被嵌入IFRAME,可以通过 `window.location.href` 改变页面的URL,使其跳转到预期的首页。 总的来说,这个压缩包中的代码是一种保护网站安全的实践,通过JavaScript来防止内容被非法嵌入,...

    JS获取iframe内容【简化版】

    ### JS获取iframe内容【简化版】 #### 知识点概览 本文将详细介绍如何通过JavaScript(简称JS)来获取一个内嵌在当前页面中的iframe的内容。这种方法特别适用于那些需要动态加载或更新iframe内部数据的应用场景。...

    js获取iframe中的内容

    JS 获取 iframe 中的内容 在 Web 开发中,我们经常会遇到需要获取 iframe 中的内容的情况。iframe 是 HTML 中的一个元素,用于嵌入其他网页或文件。今天,我们将探讨如何使用 JavaScript 获取 iframe 中的内容。 ...

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

    ### 自动调节iframe高度,而不显示其滚动条 js #### 背景介绍 在网页开发过程中,经常会遇到需要在一个页面内嵌入另一个页面的情况,这时通常会使用HTML中的`iframe`元素来实现。然而,当嵌入的内容高度不确定或者...

    jq替换iframe里面视频关闭自动播放的功能

    通过jq把ifram里面的视频转换成不自动播放的视频。 希望有需要的同志们采纳一下。

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

    js 控制 Iframe 高度自适应是指使用 JavaScript 语言来控制 iframe 的高度,使其能够自动调整以适应内容的高度。 在 iframe 高度自适应中,需要考虑多种浏览器的兼容性问题,包括 Firefox、IE、Opera 等不同的...

    让iframe框架网页在任何浏览器下自动伸缩

    标题中的“让iframe框架网页在任何浏览器下自动伸缩”是指一种技术,目的是使嵌入在HTML页面中的IFrame(内联框架)可以根据其内容自动调整大小,以适应不同浏览器和设备的显示需求。IFrame是一种HTML元素,它允许...

    js调用iframe实现打印页面内容的方法

    通过上述介绍,我们可以了解到使用JS调用iframe实现页面内容打印的方法主要分为以下几个步骤:准备打印内容、创建并配置iframe、调用打印功能以及处理打印后的清理工作。这些技术手段为网页开发者提供了灵活的方式来...

    Flex中利用IFrame解决嵌入HTML时Flex组件被遮挡和IFrame被隐藏的问题

    同时,确保IFrame的大小能够适应嵌入的HTML内容,可以使用`width`和`height`属性或者设置`frameborder`为0以适应内容自动调整大小。 在IFrameTest这个示例项目中,开发者可能已经实现了针对Flex菜单遮挡问题的解决...

Global site tag (gtag.js) - Google Analytics