网上关于iframe高度自适应的代码有很多,但比较杂乱,本文根据实用性整理了以下代码:

JavaScript部分:

折叠JavaScript Code复制内容到剪贴板

<script type="text/javascript">
function SetCwinHeight(iframeObj){
if (document.getElementById){
if (iframeObj){
if (iframeObj.contentDocument && iframeObj.contentDocument.body.offsetHeight){
iframeObj.height = iframeObj.contentDocument.body.offsetHeight;
} else if (document.frames[iframeObj.name].document && document.frames[iframeObj.name].document.body.scrollHeight){ iframeObj.height = document.frames[iframeObj.name].document.body.scrollHeight;
}
}
}
}
</script>

  

html部分:

折叠XML/HTML Code复制内容到剪贴板

<iframe name="frameContent" src="*" frameborder="0" width="100%" onload="SetCwinHeight(this)"></iframe>

  

标记*号的地方填入iframe页面的地址。需要注意的是,src地址必须是在同一网站下,否则会出现“权限被禁止”的错误。

兼容firefox的iframe高度自适应代码的更多相关文章

  1. jQuery解决iframe高度自适应代码

    网上查了好多用着都不行,自己搞定了:在包含iframe的页面中加入以下脚本,基本思想是在iframe加载内容后重新设置高度,下面代码尽在IE6中用过,没在其他浏览器中测试. 代码如下: <scr ...

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

    在实际的项目进行中,很多地方可能由于历史原因不得不去使用iframe,包括目前正火热的应用开发也是如此. 随之而来的就是在实际使用iframe中,会遇到iframe高度的问题,由于被嵌套的页面长度不固 ...

  3. Iframe高度自适应(兼容IEFirefox、同域跨域)

    在实际的项目进行中,很多地方可能由于历史原因不得不去使用iframe,包括目前正火热的应用开发也是如此. 随之而来的就是在实际使用iframe中,会遇到iframe高度的问题,由于被嵌套的页面长度不固 ...

  4. 跨域iframe高度自适应(兼容IE/FF/OP/Chrome)

    采用JavaScript来控制iframe元素的高度是iframe高度自适应的关键,同时由于JavaScript对不同域名下权限的控制,引发出同域.跨域两种情况. 由于客户端js使用浏览器的同源安全策 ...

  5. 跨域iframe高度自适应(兼容IE/FF/OP/Chrome)

    采用JavaScript来控制iframe元素的高度是iframe高度自适应的关键,同时由于JavaScript对不同域名下权限的控制,引发出同域.跨域两种情况. 由于客户端js使用浏览器的同源安全策 ...

  6. iframe高度自适应

    前两天在网上看到了一道面试题,问iframe高度自适应的问题.发现自己之前几乎没有关注过iframe的问题,所以在这里记录一下. 原题目是: 页面A的域名是:http://www.taobao.com ...

  7. iframe高度自适应内容

    JS自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹.对于用户体验和网站美观起着重要作用. 如果内容是固定的,那么我们可以通过CSS来给它直接定义一个高 ...

  8. 完美实现跨域Iframe高度自适应【Iframe跨域高度自适应解决方案】

    Iframe的强大功能偶就不多说了,它不但被开发人员经常运用,而且黑客们也常常使用它,总之用过的人知道它的强大之处,但是Iframe有个致命的“BUG”就是iframe的高度无法自动适应,这一点让很多 ...

  9. CSS完美实现iframe高度自适应(支持跨域)

    Iframe的强大功能偶就不多说了,它不但被开发人员经常运用,而且黑客们也常常使用它,总之用过的人知道它的强大之处,但是Iframe有个致命的"BUG"就是iframe的高度无法自 ...

随机推荐

  1. Ecshop 安装时错误

    网上提示方法将install/includes/lib_installer.php以下内容修改后仍然提示失败: include(ROOT_PATH . 'install/languages/' . $ ...

  2. AngularJs在单击提交后显示验证信息.

    <!DOCTYPE html> <html ng-app="app"> <head> <meta charset="utf-8& ...

  3. [kuangbin带你飞]专题十四 数论基础

            ID Origin Title   111 / 423 Problem A LightOJ 1370 Bi-shoe and Phi-shoe   21 / 74 Problem B ...

  4. SELinux配置不当导致httpd无法在非80端口启动

    检测是否为selinux导致httpd启动失败,若setenforce 0以后就可以启动,就表示selinux配置不当. 首先本机要支持semanage命令,安装方法网上有. semanage  po ...

  5. 黑马程序员_JAVA基础知识总结2

    ------- android培训.java培训.期待与您交流! ---------- IDE ---> Itegrity Development Environment Java EE --- ...

  6. Android Studio 修改 包名 package name

    我们的包名中含有Nav,造成声音不能正常出来:需要改包名,但 android studio 改包名原来还是比较麻烦的,不过现在简单多了: 第一步,直接打开 AndroidManifast.xml 文件 ...

  7. python-appium练习编写脚本时遇到问题

    遇到问题: 1.安卓4.2及以下系统无法识别resource-id属性 只能用text属性识别 2.输入中文无法识别 脚本最顶部增加#coding=utf-8 3.对象无法识别resource-id属 ...

  8. 将本地仓库托管到GitHub

    在初始化仓库之前,要确认ssh key是否正确 ssh -T git@github.com 正确的结果如下 Hi username! You've successfully authenticated ...

  9. canvas-a10isPointPath2.html

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. 关于lambda表达式在javascript中的使用

    了解过js函数的同学应该都知道js的函数有很多种创建方式. 如: function fun(){}: var fun=function(){}: 但最近的学习中发现了lambda表达式型的创建js的匿 ...