<div id="support_content" style='overflow:hidden;'>
<iframe scrolling="no" id='sup_ctx_iframe' name='sup_ctx_iframe' marginwidth='0' style='overflow:hidden;' marginheight='0' width='100%' frameborder='no' border='0' src='' onload="setIframeHeight();"></iframe>
</div>
function setIframeHeight() {
var iframe = document.getElementById('sup_ctx_iframe');
// 获取子页面的高度
var height = window.frames["sup_ctx_iframe"].document.getElementsByTagName("body")[0].clientHeight;
if(iframe)
{
if (undefined != iframe.ownerDocument
&& undefined != iframe.ownerDocument.body.offsetHeight) {
iframe.height = height;
}
}
}
这样每当iframe加载的时候会调用该js方法,从而实现iframe高度自适应不出现滚动条。
当然如果这个iframe是被嵌入一个div里面的,那么这个div的样式需要设置一下:
.content{
height:auto !important;
height: 500px;
min-height: 500px;
}
分享到:
相关推荐
iframe包含的页面的高度,兼容性好,iframe高度自适应
然而,`<iframe>`的高度自适应问题常常困扰着开发者,尤其是当`<iframe>`内部的内容动态加载或者变化时,如何让`<iframe>`自动调整其高度以适应内容,而不会导致滚动条溢出或内容被截断,成为了一个常见需求。...
Iframe 高度自适应是指在网页中嵌入的 iframe 元素能够根据其内容自动调整高度,以适应不同的浏览器和屏幕尺寸。js 控制 Iframe 高度自适应是指使用 JavaScript 语言来控制 iframe 的高度,使其能够自动调整以适应...
实现`iframe`高度自适应的基本思路是在页面加载完成或者窗口大小发生变化时,通过JavaScript动态计算嵌入内容的实际高度,并相应地调整`iframe`的高度。这种方法的核心在于编写合适的JavaScript函数来获取嵌入内容的...
标题“Iframe 高度自适应浏览器高度”涉及的核心知识点是如何让Iframe的大小根据其内容自动调整,特别是高度,以便始终保持与浏览器窗口的高度同步,从而提供更好的用户体验。 首先,我们需要了解Iframe的基本结构...
iframe高度自适应代码及演示页面。 适合新手,用到iframe,并且需要高度自适应的人士。 老手自动绕行,又没什么技术含量。。。 解压之后,打开iframe-auto.html之后查看效果. 如果不能查看,检查是否允许执行js
jsp 页面 iframe 高度自适应的 js 代码是指在 jsp 页面中使用 iframe 元素,並且使其高度能够自适应内容的高度。这种技术在实际应用中非常有用,例如在某些网页中,我们需要在 iframe 中嵌入一个内嵌页面,并且使其...
标题提到的“iframe自动适应高度(完美自适应高度嵌套代码)”提供了一个解决方案,它能够确保`iframe`在各种主流浏览器中都能正确地自适应内容高度,包括360浏览器、IE6-9、遨游、火狐以及搜狗浏览器。 在传统的`...
本篇文章将详细探讨如何实现`iframe`根据页面内容自适应高度和宽度。 首先,我们需要理解`iframe`的基本结构。一个简单的`iframe`标签如下: ```html <iframe src=...
在某些情况下,如果`iframe`内容与主页面同源,可以使用CSS的`resize`属性来尝试让`iframe`自适应高度。但是,这种方法并不适用于跨域的情况。 2. **JavaScript/jQuery解决方案**: 对于跨域的`iframe`,可以采用...
2. JavaScript处理:通过`contentWindow`和`contentWindow.document`获取子页面高度,或使用`postMessage`和`message`事件进行跨域通信。 3. 动态调整:在父页面中监听事件,接收到高度信息后更新`iframe`的高度。 ...
由于同源策略,`iframe`默认无法访问或操作不同源的页面内容,包括获取页面高度、读取内容等。为了解决这个问题,我们可以利用`CORS`(Cross-Origin Resource Sharing,跨源资源共享)机制。在服务器端,通过设置...
为了解决这个问题,我们需要让`iframe`能够自适应其内容的高度。本文将详细讲解如何使用JavaScript实现`iframe`自适应高度的解决方案,确保在各种主流浏览器中都能正常工作。 首先,理解`iframe`的基本结构和属性是...
这个库允许的高度与同跨域iframe来适应他们所包含的内容的宽度自动调整大小。它最常见的问题与使用iframes提供一系列的功能,其中包括: 高度和宽度大小的iframe内容大小。 作品以多个嵌套的iframe。 跨域iframe域...
在网页开发中,有时我们需要使用`iframe`来嵌入外部页面或者内容,但是`iframe`的高度自适应问题一直是一个常见的挑战。特别是在不同浏览器之间,由于兼容性问题,往往需要额外的处理才能达到理想的效果。本篇文章将...
完美解决跨域iframe的高度自适应,完美解决跨子域iframe的高度自适应,嵌入几个页面解决跨域iframe的高度自适应。。。
使用了`onload`事件来监听`iframe`内容加载完成,然后通过`document.all['myframe']`获取到`iframe`元素,并通过`myframe.document.body.scrollHeight`获取内部文档的实际高度,最后将这个高度设置给`iframe`元素的`...
为了解决这个问题,我们可以使用JavaScript来让IFRAME框架的高度自适应页面内嵌不同的网页内容。 在这篇文章中,我们将介绍使用JavaScript来让IFRAME框架的高度自适应的方法。首先,我们需要定义一个函数来获取当前...
多层嵌套iframe 自适应高度的解决方法