核心提示:弹出一个窗口后,后面的层不可操作(代码问题)htmlheadtitle弹出一个窗口后,后面的层不可操作/titlemeta charset=utf-8scriptfunction show()//显示...
弹出一个窗口后,后面的层不可操作(代码问题)
<html> <head> <title>弹出一个窗口后,后面的层不可操作</title> <meta charset="utf-8"> <script> function show() //显示隐藏层和弹出层 { var hideobj=document.getElementById("hidebg"); hidebg.style.display="block"; //显示隐藏层 hidebg.style.height=document.body.clientHeight+"px"; //设置隐藏层的高度为当前页面高度 document.getElementById("hidebox").style.display="block"; //显示弹出层 } function hide() //去除隐藏层和弹出层 { document.getElementById("hidebg").style.display="none"; document.getElementById("hidebox").style.display="none"; } </script> <style> body { margin:0px;padding:0px;text-align: center;} #hidebg { position:absolute;left:0px;top:0px; background-color:#000; width:100%; /*宽度设置为100%,这样才能使隐藏背景层覆盖原页面*/ filter:alpha(opacity=60); /*设置透明度为60%*/ opacity:0.3; /*非IE浏览器下设置透明度为60%*/ display:none; /* https://www.jb51.net */ z-Index:2;} #hidebox { position:absolute;width:400px;height:300px;top:200px;left:30%;background-color:#fff;display:none;cursor:pointer;z-Index:3;} #content { text-align:center;cursor:pointer;z-Index:1;} </style> </head> <body> <p id="hidebg"></p> <p id="hidebox" onClick="hide();">点击关闭</p> <p id="content" onClick="show();">点击试试</p> </body> </html>