这个简单，给你一段简单的示例代码，你可以参考下：
html+css部分：
JavaScript部分：
运行效果
代码也给你放上来，你自己复制过去运行看效果吧
body,html{margin: 0px;padding: 0px;}
div.dialog{width: 500px;height: 300px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;
background:white;top: 50%;margin-left: -250px;left: 50%;margin-top: -150px;position: relative;box-sizing: border-box;}
#container{width: 100%;height: 100%;position: fixed;filter: alpha(opacity=50);
background-color: rgba(0,0,0,.5);left: 0px;top: 0px;display: none;}
#close_btn{font: bold 28px/30px "microsoft yahei";color: darkgrey;float:right;margin-right: 5px;cursor: pointer;}
#open_diaog{border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;height: 50px;width: 150px;border: 0px;
background: deepskyblue;font: bold 6px/21px "microsoft yahei";cursor: pointer;}
×
我是模态对话框
有问题记得追问我，觉得不错的点个赞，蟹蟹支持。
如何使用JavaScript构建模态框插件？
利用iframe，设置最高z序。
新手学习js是直接学vue，还是从jquery开始学？
本来不想写，作为10年的老weber，在这里多嘴几句！web技术变化太快，而jquery却到现在都没有淘汰，想一想为什么！还有，vue等新框架，确实简化了编程的繁琐度，这是他的优点。但是，vue能做的，jquery都能做，jquery能做的，vue不一定能做。同样，jquery能做的，js都能做，而js能做的，jquery不一定能做！面试的时候，很多人说精通vue。而精通，是指精通vue的源码和思想。一问，十不知！只能说会vue！js，看着很简单，没个五六年，不能说精通js。个人建议，先学js基础，然后jquery和vue，数据模型驱动要学，操作dom也要会。同时，再回去学习js，不断的反复。不要局限于一种方式，过时的是框架，不是语言！
相关推荐
-
代理记账公司用什么软件记账,会计代理记账公司用什么财务软件好？
会计代理记账公司用什么财务软件好，大家来说一说。 文章来源公众号：软件职场很多做会计的朋友，都会自己接点小公司的外帐来做赚点外快，也有很多出来合伙成立代理记账公司的，他们普遍都问过这个问题：代理记账用...
-
新浪微博怎么批量取消关注（微博批量取消关注在哪里）
今天到微博看了下，发现自己的微博一不小心关注了好多了，上百个关注，不想关注了想取关，一个个取关又比较麻烦，那么新浪微博怎么批量取消关注，今天我来教大家。 1.首先我们登陆我们的新浪微博主页，在主页上点击...
-
扩容tf卡怎么恢复实际容量,扩容TF卡用什么软件可以恢复正常容量？
检测扩容卡最常用软件 mydisktest 和 USBOOT使用方法:1、先运行USBOOT将内存卡格式化，选“HDD”工作模式，通过格式化现出真容量。(因为有时候直接用mydisktest还检测不出来，不得不感慨，现在赚黑心钱的人技术也见长...
-
电子书vivo下载手机版,vivo手机电子书要付费，求推荐几个免费的电子书软件？
我平时也喜欢看书，用过很多看书app，给你推荐二款免费看书的，一款免费听书的软件，看累了听书也很不错哟！你可以试下。第一、快读全本小说绝不花钱，全部小说免费看，追书不受钱包阻碍！缓存功能，没网也能畅快读...
-
怎么防止黑客攻击,怎样防止网络黑客攻击呢？
一般网站建设之后的话，没有流量及PR值一般比较安全，一般网站权重大于等于2就会引来很多攻击与鸡翅，一旦可能出现的这几种情况居多，网站被挂木马，网站被黑，网站被攻击这几种情况。防挂马方法：1、建议用户通过ft...
-
电脑无线网卡显示无法识别的usb设备，无线网卡 未知usb设备
打开设备管理，将所有显示的未知USB设备驱动程序进行卸载，一般情况下，如果你使用的是WINDOWS 10系统，只需要重新启动电脑重新启动电脑之后，先将你所使用的USB设备重新连接，在台式电脑的后置USB接口，笔记本尽可...