时间：2021-07-01 10:21:17 帮助过：40人阅读
1 背景半透明遮罩层样式
需要一个黑色（当然也可以其他）背景，且须设置为绝对定位，以下是项目中用到的css样式：
/* 半透明的遮罩层 */
#overlay {
background: #000;
filter: alpha(opacity=50); /* IE的透明度 */
opacity: 0.5; /* 透明度 */
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 100; /* 此处的图层要大于页面 */
display:none;
}
2 jQuery实现遮罩
3 提示框
遮罩的目的无非让人无法操作内容，突出提示框，而提示框可参考上面的制作，z-index比遮罩层更高便可。主要问题是，如何控制提示框在浏览器居中。
补充：
jQuery简单遮罩层插件：
jQuery代码：
css样式：
#ui-mask
{
background-color: #666;
position: absolute;
z-index: 9999;
left: 0;
top: 0;
display: none;
width: 100%;
height: 100%;
opacity: 0.5;
filter: alpha(opacity=50);
-moz-opacity: 0.5;
}
#ui-mask-div img
{
width: 50px;
height: 50px;
float: left;
}
#ui-mask-div span
{
height: 50px;
line-height: 50px;
display: block;
float: left;
color: Red;
font-weight: bold;
margin-left: 5px;
}
使用方法：
希望本文所述对大家jQuery程序设计有所帮助。