`

iframe高度自适应js脚本

阅读更多
//** iframe自动适应页面 **//

//输入你希望根据页面高度自动调整高度的iframe的名称的列表
//
用逗号把每个iframe的ID分隔. 例如: ["myframe1", "myframe2"],可以只有一个窗体,则不用逗号。

//定义iframe的ID
var iframeids=["toollist","maintainrecords"]

//如果用户的浏览器不支持iframe是否将iframe隐藏 yes 表示隐藏,no表示不隐藏
var iframehide="yes"

function dyniframesize() 
...{
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++)
...{
        
if (document.getElementById)
...{
//自动调整iframe高度
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) //如果用户的浏览器是NetScape
dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight; 
else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) //如果用户的浏览器是IE
dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
}

}

//根据设定的参数来处理不支持iframe的浏览器的显示问题
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
 
分享到:
评论

相关推荐

    Iframe 高度自适应浏览器高度

    标题“Iframe 高度自适应浏览器高度”涉及的核心知识点是如何让Iframe的大小根据其内容自动调整,特别是高度,以便始终保持与浏览器窗口的高度同步,从而提供更好的用户体验。 首先,我们需要了解Iframe的基本结构...

    用jquery实现iframe高度自适应实例代码完美兼容多数浏览器

    最后,`MainFrame.html`和`用jquery实现iframe高度自适应完美兼容多数浏览器.html`可能是包含上述代码的实际示例页面,而`js`文件夹可能包含了jQuery库和其他可能的辅助脚本。 总结,通过jQuery,我们可以优雅地...

    iframe自适应高度和宽度

    ### iframe自适应高度和宽度详解 在Web开发中,`iframe`(Inline Frame)是一种常用的HTML元素,用于在当前页面内嵌入另一个HTML文档。它能够实现页面内部局部刷新的效果,广泛应用于各种复杂的网页布局中。然而,...

    可编辑iframe高度自适应(编辑器所见即所得模式)

    总的来说,实现可编辑`iframe`的高度自适应需要结合HTML、CSS和JavaScript的知识,尤其是利用JavaScript来监听和响应`iframe`内容的变化。通过这种方法,可以确保用户无论在Firefox、Chrome、IE8还是Safari等浏览器...

    jquery对iframe自适应高度插件

    总之,“jquery对iframe自适应高度插件”是解决`iframe`高度自适应问题的一个强大工具,它的易用性和效率使得它成为开发者处理`iframe`高度问题的首选方案。通过合理利用这个插件,可以避免手动计算和调整`iframe`...

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

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

    js实现iframe自动自适应高度的方法

    本篇文章将详细介绍如何使用JavaScript实现Iframe的自动自适应高度。 首先,理解基本概念。Iframe的`height`属性决定了其显示区域的高度,当我们想要Iframe内容自适应时,我们需要动态地修改这个属性值,使其等于...

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

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

    jQuery解决iframe高度自适应代码

    为了实现iframe高度自适应的功能,我们通常需要借助于JavaScript库来简化开发过程,其中jQuery无疑是一个广受欢迎的选择。jQuery提供了一套简洁的API,可以让我们轻松地进行DOM操作、事件处理以及动画效果等操作。在...

    iframe自适应高度.rar

    【标题】:“iframe自适应高度.rar”涉及到的关键知识点主要集中在如何使用JavaScript来处理网页中iframe元素的高度自适应问题。在Web开发中,iframe(Inline Frame)是一种内联框架,常用于在同一个HTML文档中嵌入...

    iframe跨域常用问题和iframe页面自适应

    本篇文章将深入探讨两个关键知识点:`iframe`跨域问题以及`iframe`页面的自适应。 一、`iframe`跨域问题 跨域是Web开发中的一个重要概念,它限制了浏览器从一个源获取另一个源的资源,以保护用户的安全。当`iframe...

    iframe高度自适应

    这种方法通过运行JavaScript或jQuery脚本来检测`iframe`的内容高度,并将其设置为`iframe`的`height`属性。首先,你需要在父页面和`iframe`页面中引入jQuery库。然后,在父页面中添加以下代码: ```javascript $...

    iframe自适应高度

    总之,`iframe`自适应高度是一个常见的前端挑战,通过合理的JavaScript脚本和CSS技巧,我们可以实现良好的用户体验,无论是在桌面端还是移动端。同时,随着Web技术的发展,未来可能还会出现更多新的解决策略。

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

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

    IFRAME自适应

    "Noname1.html"可能是演示IFRAME自适应的一个实例,可能包含了IFRAME元素和相应的CSS或JavaScript代码,用于展示如何实现IFRAME的高度自适应。 总结,IFRAME自适应是创建响应式网页的重要组成部分,它涉及到布局、...

    html嵌入html,高度自适应,标签切换。

    在"新建文件夹 (2)"这个压缩包内,可能包含了实现上述功能的HTML、CSS和JavaScript文件,包括但不限于index.html(主页面),style.css(样式表),script.js(JavaScript脚本),以及可能的子页面HTML文件。...

    如何设置iframe高度自适应在跨域情况下的可用方法

    在页面上使用iframe来动态加载页面内容是网页开发中比较常见的方法。在父页面中给定一个不带滚动条的iframe,然后对属性src指定一个可加载的页面...这时候脚本没有办法获取到子页面的高度,存在JavaScript跨域的问题!

    兼容主流浏览器的iframe自适应高度js脚本

    兼容主流浏览器的 Iframe 自适应高度,js脚本如下: 代码如下: //iframe 高度自适应 function iframeAutoFit(iframeObj) { setTimeout(function () { if (!iframeObj) return; iframeObj.height = (iframeObj....

Global site tag (gtag.js) - Google Analytics