上午闲来无事,用html及原生js写个弹窗,供参考。
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style
type="text/css"> body{ margin: 0px; } .zhezhao{ position: fixed; left: 0px;
top: 0px; background: #000; width: 100%; height: 100%; opacity: 0.5; }
.tankuang{ position: relative; background: #fff; width: 50%; height: 80%;
border-radius: 5px; margin: 5% auto; } #header{ height: 40px; } #header-right{
position: absolute; width: 25px; height: 25px; border-radius: 5px; background:
red; color: #fff; right: 5px; top: 5px; text-align: center; } </style> </head>
<body> <button type="button" onclick="dianwo()">点我</button> <div
class="zhezhao" id='zhezhao'> <div class="tankuang"> <div id="header">
<span>我是弹窗</span> <div id="header-right" onclick="hidder()">x</div> </div>
</div> </div> <script type="text/javascript">
document.getElementById('zhezhao').style.display="none"; function dianwo(){
document.getElementById('zhezhao').style.display=""; } function hidder(){
document.getElementById('zhezhao').style.display="none"; } </script> </body>
</html>
代码可直接拿来用,不足请指出。

技术
下载桌面版
GitHub
百度网盘(提取码:draw)
Gitee
云服务器优惠
阿里云优惠券
腾讯云优惠券
华为云优惠券
站点信息
问题反馈
邮箱:ixiaoyang8@qq.com
QQ群:766591547
关注微信