Jquery 浏览器警报样式
我目前有一个联系人表单,完成后会触发浏览器警报/弹出窗口,但我希望弹出窗口的样式更像一个模式。因此,弹出窗口将以黑色透明背景居中并覆盖在页面上,单击后背景会消失-这可能吗 以下是触发弹出警报的当前脚本:Jquery 浏览器警报样式,jquery,html,css,modal-dialog,Jquery,Html,Css,Modal Dialog,我目前有一个联系人表单,完成后会触发浏览器警报/弹出窗口,但我希望弹出窗口的样式更像一个模式。因此,弹出窗口将以黑色透明背景居中并覆盖在页面上,单击后背景会消失-这可能吗 以下是触发弹出警报的当前脚本: Oki doki以下是我的答案: HTML <div id="popup" style="width:250px;height:250px;background-color:rgba(255,255,255,0.5);border:3px solid black;display:none;
Oki doki以下是我的答案: HTML
<div id="popup" style="width:250px;height:250px;background-color:rgba(255,255,255,0.5);border:3px solid black;display:none;z-index:999;position:absolute;top:50%;left:50%;margin-left:-125px;margin-top:-125px;">
<div style="width:230px;height:230px;margin-left:10px;margin-top:10px;background-color:#FFFFFF;">
Thank you for submitting your details<p>
<div onclick="document.getElementById('popup').style.diplay='none';" style="margin-left:auto;margin-right:auto;width:75px;height:30px;background-color:#000000;cursor:hand;">
Close
</div>
</div>
</div>
到
您可以使用jQueryUI对话框
查看jQuery UI对话框。好的,弹出窗口现在不再是标准的浏览器弹出窗口,但是我如何使它成为一种模式样式,带有关闭按钮和黑色透明背景?为了保持简单,我不建议允许用户移动它,而只是保持它静止。若要设置样式,您只需在该容器中使用CSS和div。请参阅我的编辑。是否可以使用此样式?是的!这只是一点样式。好的,一旦我开始使用css,我应该会很好,但是我如何更改这个div代码,然后添加我的自定义css?
<div id="popup" style="width:250px;height:250px;background-color:rgba(255,255,255,0.5);border:3px solid black;display:none;z-index:999;position:absolute;top:50%;left:50%;margin-left:-125px;margin-top:-125px;">
<div style="width:230px;height:230px;margin-left:10px;margin-top:10px;background-color:#FFFFFF;">
Thank you for submitting your details<p>
<div onclick="document.getElementById('popup').style.diplay='none';" style="margin-left:auto;margin-right:auto;width:75px;height:30px;background-color:#000000;cursor:hand;">
Close
</div>
</div>
</div>
alert("Your message has been sent! Thank you for getting in touch.");
document.getElementById("popup").style.display="block";