关于弹出DIV层被视频显示插件遮挡的解决方案

admin

正常情况下，通过JavaScript脚本弹出一个DIV层会被视频显示插件遮挡：

这是由于浏览器的插件具有较高的优先级，所以会遮挡DIV元素。


解决方案：
可以在需要弹出的DIV层中加一个iframe，在这里只是借助iframe的优先级，使DIV层的优先级可以高过控件，就能使DIV的层显示在视频显示插件之上。为了不影响DIV的显示，这个iframe可以是空内容的，也可以不显示出来（hide），如：

1. 
   
2. <div id="menu" style="position:absolute;top:300px; left:500px; width:320px; height:240px; background-color:#6699cc;">
   
3. <table>
   
4.     <tr><td height="30px">测试</td></tr>
   
5. </table>
   
6. <iframe style="position:absolute; visibility:inherit; top:0px; left:0px; width:100%; height:100%; z-index:9999; filter='Alpha(style=0,opacity=0)';"></iframe>
   
7. </div>
   

复制代码

或者：

1. <iframe frameborder=0 scrolling=no style="background-color:transparent; position: absolute; z-index: 9999; width: 100%; height: 100%; top: 0;left:0;"></iframe>

复制代码

admin

您好，只需要在弹出的DIV层里面加入

1. <iframe style="position:absolute; visibility:inherit; top:0px; left:0px; width:100%; height:100%; z-index:9999; filter='Alpha(style=0,opacity=0)';"></iframe>

复制代码

即可。

admin

您好，半透明的层，您是如何设置DIV的CSS属性的？

admin

您好，这里面的关键点在于需要在<div>里面加一个<iframe>，并设置<iframe>的z-index属性，这样弹出来的div就不会被AnyChat视频显示插件遮挡。

至于您所希望的将<iframe>在firefox里面实现半透明效果，则可以在网上查询一下相关的css设置方法。

admin

您好，有没有注意这一点：

另外要注意一点就是弹出的div需要设置position:absolute;属性

admin

您好，您是说不透明，或是透明都是正常的，不会被遮挡，但是半透明就会被遮挡，是这样吗？

admin

您好，如果是显示文字，可参考：http://bbs.anychat.cn/forum.php? ... =597&extra=page%3D4

admin

您好，截图看一下您实现出来的效果？