今天小编跟大家讲解下有关利用js+css简单实现半透明遮罩弹窗 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关利用js+css简单实现半透明遮罩弹窗 的相关资料，希望小伙伴们看了有所帮助。
思路： 两个div 一上一下。上面的包含iframe 用以展示弹窗内容。下面的div实现半透明的遮罩效果。 代码： 复制代码代码如下: <div id="div_window2"style="z-index:600;left:0px; visibility:hidden; width:100%; position:absolute; height:100%;"> <table width="99%"height="99%"border="0"cellpadding="0"cellspacing="0"align="center"> <tr> <td width="100%"height="100%"align="center"> <iframe id="iframe_window"width="445"height="252"noresize scrolling="no"frameborder="0"marginheight="0"marginwidth="0"topmargin="0"leftmargin="0"align="center"></iframe> </td> </tr> </table></div><div id="div_window"style="z-index:200;left:0px;visibility:hidden;width:100%;position:absolute;height:100%;background-color: #ffffff;opacity:0.8; filter:alpha(opacity=80)"></div> 其中下面的div设置css。为了兼容ie和火狐半透明要写两句：opacity:0.8; filter:alpha(opacity=80) 展示弹窗时把两个div都显示出 并赋予iframe地址。关闭时关闭两个div。 最终效果下面的div遮盖了弹窗以外的html元素 避免发生误操作。实现起来简简单单。来源：爱蒂网
