首页 > 代码库 > 当页弹出对话框的实现

当页弹出对话框的实现

image

Html代码,思路是一个背景层加一个内容层

<div id="modalBg"></div><div id="modalContent">这里是你的自定义弹出内容</div>

CSS代码

#modalBg {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: #000;opacity: 0.8;filter: alpha(opacity=50);display: none;z-index: 10000;}#modalContent {position: absolute;width: 353px;height: 141px;top: 50%;margin-top: -80px;left: 50%;margin-left: -186px;padding: 10px;display: none;z-index: 10001;text-align: center;background-color: white;border: 1px solid white;border-radius: 5px 5px;-moz-border-radius: 5px 5px;-o-border-radius: 5px 5px;-webkit-border-radius: 5px 5px;}

JS/JQ代码,自动定义显示与隐藏