object覆盖的div解决办法
最近做个web项目,因为里面有个<object>的插件,弹出<div>对话框会被其遮盖,我做了个<iframe>标签,在弹框时,把<object>覆盖掉,再在iframe上放个<div>对话框。这是这个问题的解决思路。终于将这个问题解决掉了,我将思路分享给大家以供参考。
(一)首先给大家介绍一下object标签:W3school有解释
定义和用法
定义一个嵌入的对象。请使用此元素向您的 XHTML 页面添加多媒体。此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码。
<object> 标签用于包含对象,比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash。
object 的初衷是取代 img 和 applet 元素。不过由于漏洞以及缺乏浏览器支持,这一点并未实现。
浏览器的对象支持有赖于对象类型。不幸的是,主流浏览器都使用不同的代码来加载相同的对象类型。
而幸运的是,object 对象提供了解决方案。如果未显示 object 元素,就会执行位于 <object> 和 </object> 之间的代码。通过这种方式,我们能够嵌套多个 object 元素(每个对应一个浏览器)。
总的来说object标签就是用来嵌入多媒体的。
(二)简单介绍几个object标签的重要属性:
classid -- 关联一个应用程序,执行嵌入内容的应用程序在windows系统中的唯一id(不能改变此id,否则程序将出现异常),
例如clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 -- Flash
data -- 规定对象使用的资源的 URL。
(三)object标签在IE上覆盖问题
查询相关资源后发现<object>在IE中是一个windowed element,即窗口元素,这些元素总是会被渲染在非窗口元素的上方,而iframe默认在object之上,唯一的解决方案就是使用iframe作为中间物,即用iframe覆盖object,再用div覆盖iframe。
<div class="dropdown">
<p>我是对话框</p>
<iframe id="iframe" src="about:blank" frameborder="0" marginheight="0" marginwidth="0" style="position:absolute;visibility:inherit; top:0px;left:0px;width:100%; height:100%;z-index:-1; filter:alpha(opacity=0);"></iframe>
</div>
<div style="width: 950px;height: 400px;position: relative;z-index: 9;">
<object id="CmCaptureOcx" style="width: 100%; height:100%;"
classid="clsid:3CA842C5-9B56-4329-A7CA-35CA77C7128D">
</object>
</div>
注意:
1.div必须有特定的z-index且大于iframe的z-index,不能是auto或空;
2.iframe的z-index必须为负(之前一直设置为正值,虽然小于div的z-index,但一直不能被div遮盖),否则,div无法遮盖iframe;
3.iframe的top和left为0,且iframe的宽、高与div的宽高相等;
4.注意设置iframe的透明度为0.
5.如果页面有多处弹出框,可以使用js动态添加iframe。
object覆盖的div解决办法的更多相关文章
- attributeError:'module' object has no attribute ** 解决办法
写了一个小脚本,执行的时候报错: Traceback (most recent call last): File "F:/test/qrcode.py", line 109, in ...
- wince6.0 编译报错:"error C2220: warning treated as error - no 'object' file generated"的解决办法
内容提要:wince6.0编译报错:"error C2220: warning treated as error - no 'object' file generated" 原因是 ...
- on a null object reference 问题的解决办法
FATAL EXCEPTION: …… java.lang.RuntimeException: Unable to start activity ComponentInfo…… ava.lang.Nu ...
- flash 遮住 div 解决办法
被遮盖的div 下面的代码 <!--列表菜单--> <div id="opreationmenu" style="posit ...
- 关于/usr/local/lib/libz.a(zutil.o): relocation R_X86_64_32 against `.rodata.str1.1' can not be used when making a shared object; recompile with -fPIC解决办法
具体报错截图如下: 解决方法: 题外话,我对makefill cmake也是一窍不通因此本人也是不想去积极的解决这个问题,但是当你求助无缘的时候你才会静心去思考.读到这句话的时候也许你已经发现了问题所 ...
- Android ListView嵌套Button,Button事件覆盖item事件解决办法
方法就是修改item布局的xml文件: 在根布局里加上: android:descendantFocusability="blocksDescendants" 然后在按钮布局里加上 ...
- 使用Base SDK 6.1编译的APP在iOS7的设备上运行,NavigationBar覆盖view的解决办法
if (__IPHONE_OS_VERSION_MAX_ALLOWED <= __IPHONE_6_1) { self.navigationController.navigationBar.tr ...
- 启动tomcat报错 Could not reserve enough space for object heap的解决办法
问题:打开eclips启动tomcat发现报出Could not reserve enough space for object heap错误. 解决办法:1.首先检查tomcat是否能正常启动.re ...
- object 覆盖 div 在IE 和Firefox 的解决方案
问题描述 公司产品需要在三维(3D)控件上显示弹框,按钮等,然而三维控件的object覆盖了div,弹框和按钮不能显示 firefox 解决方案 最外层div的背景使用不透明背景色,必须是不透明的哦 ...
随机推荐
- zabbix3.2 install
以下参考官网 一.Zabbix安装配置(ubuntu) 1.Zabbix服务端安装 基础情况 系统 Ubuntu 14.04.4 LTS zabbix版本 zabbix 3.2 ip 192.168. ...
- Python 基础之基本数据类型
首先,Python中的变量不需要声明.每个变量在使用前都必须赋值,变量赋值以后该变量才会被创建.在Python中,变量就是变量,它没有类型,我们所说的"类型"是变量所指的内存中对象 ...
- myeclipse10.7安装git插件
如果想把github上的一些开源项目导入到myeclipse中,一种方法是从github网站上将开源项目下载下来,另一种是使用myeclipse的egit插件直接从github网站上down下来,下面 ...
- ASP.NET Core 菜鸟之路:从Startup.cs说起
1.前言 本文主要是以Visual Studio 2017 默认的 WebApi 模板作为基架,基于Asp .Net Core 1.0,本文面向的是初学者,如果你有 ASP.NET Core 相关实践 ...
- Linux_shell 学习
shell中test的运用 test 命令是用于检查某个条件是否成立,他可以进行数值.符号.文件三个方面的测试 1.数值中的运用 -eq 等于 -ne 不等于 -gt 大于 -ge 大于等于 -lt ...
- 局域网内部署 Docker Registry
在局域网内部署 Docker Registry 可以极大的提升平时 pull.push 镜像的速度,从而缩短自动化操作的过程.同时也可以缓解带宽不足的问题,真是一举多得.本文将从创建单机的 Docke ...
- c语言项目开发流程一部曲
一.c项目开发总体分如下图所示 二.对每一步的解析 1.需求文档分析,本例以电子词典作为例子 列出每一个需求以及每一个需求的每一个特点,将其归纳 为一张表. 2.设计数据结构 设计数据结构,也就是确定 ...
- java集合(2)- java中HashMap详解
java中HashMap详解 基于哈希表的 Map 接口的实现.此实现提供所有可选的映射操作,并允许使用 null 值和 null 键.(除了非同步和允许使用 null 之外,HashMap 类与 H ...
- nrm是什么?以及nrm的安装与命令
nrm的作用与安装使用 一.nrm是什么? 这是官方的原话: 开发的npm registry 管理工具 nrm, 能够查看和切换当前使用的registry, 最近NPM经常 down 掉, 这个还是很 ...
- MySQL中间件Atlas安装及使用
简介 Atlas是由 Qihoo 360公司Web平台部基础架构团队开发维护的一个基于MySQL协议的数据中间层项目.它在MySQL官方推出的MySQL-Proxy 0.8.2版本的基础上,修改了大量 ...