jsp 遮蔽效果框

在项目开发中，遮蔽效果必不可少，今天项目中有这个需求，分享给大家。

 <DIV ID="sending"  STYLE=" FONT-SIZE: 8pt; Z-INDEX: 9999;
           FONT-FAMILY: Tahoma; visibility:hidden;
           CURSOR: default; position: absolute;left:100px;top:200px;" onselectstart="window.event.returnValue=false;" align="left">
    <table width=500px border=0 cellspacing=0 cellpadding=0>
     <tr>
      <td valign='middle'>
       <table width=100% height=50 border=0 cellspacing=0 cellpadding=0 class='CommonMessageIn'>
        <tr>
         <td colspan='2' class='CommonMessage_title'>系统提示:</td>
        </tr> 
        <tr bgcolor='D2EEFF'>
         <td class='CommonMessage_pic' align='center' valign='middle'><img src="images/icon_attention.gif"></td>
         <td class="CommonMessage_content">
         正在处理中，请耐心等待...        </td>
        </tr>
       </table>
      </td>
     </tr>
   </table>
          
  </DIV>

思路：页面定义一个div遮蔽层，然后默认设置为hidden，如果要显示则修改属性visibility可见。

其中样式可以自己定义，我这里定义为：

/*提示信息表格*/
table.CommonMessage{
 
  background-color: #FFFFFF;
   border-right: #F2F2F2 2px solid;
   border-bottom: #F2F2F2 2px solid;
 width:530px;
 margin-bottom:36px;}
table.CommonMessageIn{
border:1px solid #AAAAAA;
width:100%;
height:100%;
}
.CommonMessageTd{
border-top:1px solid #A9A9A9;
}
/*提示標題TD*/
td.CommonMessage_title{
 height:28px;
 font-size:14px;
 border-top-color:#C3E8FF;
 border-top-style:solid;
 border-top-width:1px;
 text-align:center;
 font-weight:bold;
 background-image:url("../images/thr.gif");
}
/*提示圖TD*/
td.CommonMessage_pic{ width:20%
text-align:center;
vertical-align:middle;}
/*提示具體提示信息TD*/
td.CommonMessage_content{ width:80%}
/*提示的控制按鈕TD*/
td.CommonMessageCon{
text-align:center; height:35px;}