需求:在一个div里面嵌套一个iframe(src="ui.html"),div有背景图片,要让iframe里的内容透明地显示在div层上。

刚开始直接把iframe放在div中,结果iframe的背景(默认为白色)挡住了div层的背景,后来在ui.html的最外层div的style上加了background:transparent;属性,FF下显示透明,但在IE下iframe的背景为透明的(改变桌面的窗口颜色 ,效果会更清晰),依然挡住了div层的背景。后来又在iframe标签上加了一个 allowtransparency="true"属性,OK这下就满足需求啦。完整HTML如下:

div:

<div style="width:900px;height:30px;background:url("/img/l.gif") repeat-x;text-align:left">
<iframe width="300px" height="30px" style="float:left;" frameborder="0" scrolling="no" align="top" src="/ui.html"></iframe>
</div>

ui.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body style="background:transparent;">
<div id="uui">
欢迎大家光临!!!
</div>
</body>
</html>

让iframe调用页面的背景透明的更多相关文章

  1. iframe调用页面中的局部部分

    iframe 调用网页,div遮挡展现局部. <div style=" width:iframe宽度; height:iframe高度; overflow:hidden "& ...

  2. IOS修改webView背景透明以及IOS调用前台js的方法

    工作上遇到IOS的webView中的H5页面需要透明以显示webView的背景颜色.用H5自身的透明度的css样式或者js控制背景颜色及透明度都打不到想要的效果,最后还是通过ios设置webView中 ...

  3. 关于iframe调用父页面元素操作

    在iframe子页面获取父页面元素 代码如下: //在iframe子页面获取父页面元素 $.('#objld', parent.document); //在父页面获取iframe子页面的元素 $(&q ...

  4. JQuery调用iframe父页面元素与方法

    JQuery操作iframe父页面与子页面的元素与方法 下面简单使用Jquery来操作iframe的一些记录,这个使用纯JS也可以实现. 第一.在iframe中查找父页面元素的方法: $('#id', ...

  5. Iframe父页面与子页面之间的调用

    原文:Iframe父页面与子页面之间的调用 Iframe父页面与子页面之间的调用 专业词语解释如下:     Iframe:iframe元素是文档中的文档.     window对象: 浏览器会在其打 ...

  6. iframe子页面调用父页面javascript函数的方法

    1.iframe子页面调用 父页面js函数 子页面调用父页面函数只需要写上window.parent就可以了.比如调用a()函数,就写成: window.parent.a(); 2.iframe父页面 ...

  7. Javscript调用iframe框架页面中函数的方法

    Javscript调用iframe框架页面中函数的方法,可以实现iframe之间传值或修改值了, 访问iframe里面的函数: window.frames['CallCenter_iframe'].h ...

  8. 如何在ie6/ie7/ie8中实现iframe背景透明

    最近做了一个项目,涉及到ie8iframe背景透明的问题,做了老半天,才把它搞定的,现在把我的经历贴出来和大家分享: 众所周知的根据W3C CSS 2.1 规范规定,''''background-co ...

  9. 如何通过iframe调用其他页面的内容

    我们在建站的时候经常会在页面出现同样的内容,比如公司简介之类的,这些东西很长,会减低网页的原创程度,相似度太高,对SE不是很友好.这时我们可以考虑把这部分内容写成一个单独的简单页面,然后通过ifram ...

随机推荐

  1. Scrapy开发

    最近要开发一个软件需要爬取网站信息,于是选择了python 和scrapy下面做一下简单介绍:Scrapy安装连接,scrapy官网连接 所谓网络爬虫,就是一个在网上到处或定向抓取数据的程序,当然,这 ...

  2. Atlas mysql的读写分离和负载均衡<转>

    mysql的读写分离和负载均衡 http://my.oschina.net/superbigfu/blog/178134

  3. 读书笔记--用Python写网络爬虫01--网络爬虫简介

    Wiki - Web crawler 百度百科 - 网络爬虫 1.1 网络爬虫何时使用 用于快速自动地获取网络信息,避免重复性的手工操作. 1.2 网络爬虫是否合法 网络爬虫目前人处于早期的蛮荒阶段, ...

  4. SpringMVC07处理器方法的返回值

    <body> <!--返回值是string的内部视图 --> <a href="user/add">add</a> <!--返 ...

  5. IIS配置

    IIS配置文档: 1.安装IIS.控制面板→程序→打开关闭Windows功能,Web管理服务和万维网服务都勾上. 2.部署网站:ASP.Net项目的发布:项目中点右键“发布”,选择“文件系统”,发布到 ...

  6. wpf的学习日志(一)

    今天开始学习wpf,从xaml的布局开始 stackpanel布局:Orientation决定布局的横向还是纵向,HorizontalAlignment决定布局的对齐 <StackPanel O ...

  7. c#将Excel数据导入到数据库的实现代码(转载)

    假如Excel中的数据如下:     数据库建表如下:     其中Id为自增字段:      代码如下: using System; using System.Collections.Generic ...

  8. OD: SafeSEH

    SafeSEH 对异常处理的保护原理 在 Windows XP sp2 以及之后的版本中,微软引入了 S.E.H 校验机制 SafeSEH.SafeSEH 需要 OS 和 Compiler 的双重支持 ...

  9. JAVAEE学习

    首先要明白Java体系设计到得三个方面:J2SE,J2EE,J2ME(KJAVA).J2SE,Java 2 Platform Standard Edition,我们经常说到的JDK,就主要指的这个,它 ...

  10. socket.io 中文手册 socket.io 中文文档

    socket.io 中文手册,socket.io 中文文档转载于:http://www.cnblogs.com/xiezhengcai/p/3956401.html 服务端 io.on('connec ...