object覆盖的div如何解决？

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了object覆盖的div如何解决？，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含2261字，纯文字阅读大概需要4分钟。

内容图文

（一）首先给大家介绍一下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如何解决？的详细内容，更多请关注Gxl网其它相关文章！

内容总结

以上是互联网集市为您收集整理的object覆盖的div如何解决？全部内容，希望文章能够帮你解决object覆盖的div如何解决？所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端