最近有些web页面经常用到iframe,但是遇到两个很棘手的问题,一是高度自适应的问题,二是iframe出现空白页面,要如何让它背景透明?我设置了style="background-color:transparent;"但没有效果,以下是解决方法:

<iframe
id="iframepage" name="mainIFrame"
frameBorder=0  allowtransparency="true"
style="background-color:transparent;min-height:1000px;"
scrolling=no width="100%" onLoad="iFrameHeight()">
</iframe>

javascript:

<script type="text/javascript" language="javascript">function iFrameHeight() {var ifm = document.getElementById("iframepage");var subWeb = document.frames ? document.frames["iframepage"].document: ifm.contentDocument;if (ifm != null && subWeb != null) {ifm.height = subWeb.body.scrollHeight+72;}}
</script>

iframe透明 自适应高度相关推荐

  1. 实现IFrame的自适应高度

    这个函数可以:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象 <script type="text/javascript ...

  2. 网上收集的关于iframe的自适应高度代码js的

    <一>这个是我第一个用的不是很灵验,也没去研究:代码--> 1<iframename="ifrName"src="targetName.htm&q ...

  3. 如何实现iframe(嵌入式帧)的自适应高度

    好几次看到有人提问问到如何实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象,刚好我在工作中也碰到了类似问题,于是上网翻查,东抄抄西看看,弄 ...

  4. [转]让iframe自适应高度-真正解决

    原文地址:https://www.cnblogs.com/rogge7/p/7762052.html 需求:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同 ...

  5. php iframe 自适应高度,两个iframe自适应高度的解决方法

    很多小伙伴在做网站的时候对于解决 1.需求分析: 使页面中的iframe可以自适应高度,避免页面高度增加的时候页面和iframe会同时出现滚动条. 2.方法一: 在iframe上面直接加onload的 ...

  6. iframe 自适应高度的多种实现方式

    iframe高度自适应内容 需求:实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象. 设置iframe 自适应高度,使其等于内嵌网页的高度 ...

  7. php iframe 自适应高度,iframe自适应高度

    很多小伙伴在做网站的时候对于解决iframe的高度问题都是很头大的一件事,今天吾爱编程为大家介绍一下iframe自适应高度的方法,有需要的小伙伴可以参考一下: 1.需求分析: 使页面中的iframe可 ...

  8. html表格高度自动调整,table表格自适应高度的办法

    这篇文章主要为大家详细介绍了table表格自适应高度的办法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴. 关于自适应高度,361源码在以前给大家介绍过ifram ...

  9. Iframe用法的详细讲解(属性、透明、自适应高度)和html中滚动条属性设置

    Iframe 用法的详细讲解(属性.透明.自适应高度)和html中滚动条属性设置 scrollbar属性.样式详解 1. overflow内容溢出时的设置(设定被设定对象是否显示滚动条) overfl ...

  10. 一行代码解决IFrame自适应高度问题

    在iframe的src文件中写入JS代码 $(window.parent.document).find("iframe").height($(document).height()) ...

最新文章

  1. CF 990A. Commentary Boxes【数学/模拟】
  2. python3 import 和__import__() 的区别
  3. C#语言学习思维导图
  4. 比特币早期投资家:没有人能够阻止其发展 TechWeb 09-27 09:10 凤凰科技讯 据CNBC网站北京时间9月27日报道,风险投资家、“Social+Capital”基金创始人Chamath
  5. 蓝字冲销是什么意思_60秒学个词:Elusive 是什么意思?(美音版)
  6. SAP 电商云 Spartacus UI feature level 的一个测试
  7. Linux文件属性4——读取目录文件
  8. 服务化改造实践(三) | Dubbo + Zipkin
  9. 元素隐式具有 “any” 类型,因为类型“Shared”没有索引签名问题解决思路
  10. js设置控制滚动条位置
  11. 2020年5月数据库流行度排行:疫情下开源数据库逆势增长,新基建下国产数据库迎机遇...
  12. Eclipse启动参数
  13. 【转载】二分图最大匹配的König定理及其证明 Matrix67原创
  14. 数据结构与算法-------希尔排序------交换法+移动法
  15. 拓端tecdat|r语言多均线股票价格量化策略回测
  16. OpenCV-Python教程8-图像混合
  17. vfp中写入文本文件_VFP文件操作函数用法.doc
  18. MultiDock——专门为 macOS 设计的增强型 Dock
  19. python构建电商用户画像(1)
  20. S3接口访问华为云OBS

热门文章

  1. 代码审查工具 phabricator 使用学习
  2. PHP如何在两个大文件中找出相同的记录?
  3. 软件测试简历项目经验该怎么写?【两年经验】
  4. python开发贴吧_python爬虫-贴吧
  5. web前端课程设计源码大全(HTML+CSS+JS)
  6. 计算机软考知识点总结,计算机软考考试必备知识点:风险识别
  7. Dagger2的使用示例
  8. 超级素数c语言,每个位都为素数
  9. 洛谷试炼场--1-2顺序与分支(java版)
  10. 弹性系数和线径的计算公式_压缩弹簧的弹性系数计算