起因
设计要求视频控制面板显示在视频界面上，如下图红框内所示。但是因为object不在文档流之中，所以不论别的元素设置z-index多高，都只会被object元素遮住而无法看到。
object元素代码如下
<object id="EZUIKit" width="400" height="400" border="0" name="EZUIKit"> </object>
解决方案
方法一： 直接设置属性值
在代码中增加属性
value="transparent"
<object id="EZUIKit" width="400" height="400" border="0" value="transparent" name="EZUIKit"> </object>
在谷歌等浏览器中有效，但是IE中无效，因为需要activeX插件支持，必须兼容IE，所以此方法不适用，尝试第二种方法
方法二：iframe
iframe 元素会创建包含另外一个文档的内联框架，所以将object元素或者要放置在object上的元素包含在iframe中，可以做到高于object元素显示，我选择的是后者，将需要显示在视频上的内容嵌入iframe中的页面
<iframe> 需要显示在object上的标签内容 </iframe>
确实可以显示在object元素之上，但是却不透明。如下图，会一整块遮挡住下面的视频内容。
设置属性allowtransparency="true"后在谷歌浏览器中会透明，可以显示下面的视频，但IE中无效，所以需要继续尝试。
<iframe allowtransparency="true"> </iframe>
设置iframe的背景色透明
<iframe allowtransparency="true" style="background-color: transparent"> </iframe>
设置后iframe背景透明，但是却无视了中间的object，穿透了object，直接显示的是iframe所在的父元素背景色，即使将iframe父元素设置透明也无用，会继续显示父元素的父元素背景色，无法显示该区域遮挡住的视频内容。
结论
IE中无法做到div元素显示在上并背景色透明的效果，谷歌可以实现，IE建议除非需要整块遮挡下面的视频而不需要透明，否则将需要放置在object上的元素移出来，与object互不干涉。
---------------------
作者：云端的幻影
来源：CSDN
原文：https://blog.csdn.net/weixin_44849078/article/details/89160520
原文地址：https://www.cnblogs.com/jearay/p/11130951.html