js弹出层

js:

<script language="JavaScript" type="text/javascript">
     function showWindow() {

         mask = document.createElement("div");
         var W = $(document).width();
         var H = $(document).height();
         mask.id = "mask";
         mask.style.cssText = "position:absolute;z-index:5;width:" + W + "px;height:" + H + "px;background:#000;filter:alpha(opacity=30);opacity:0.3;top:0;left:0;";
         document.body.appendChild(mask);
         var o = document.getElementById("edit");
         o.style.display = "block";
         o.style.top = "253px";
         o.style.left = "400px";
     }
     function closeWindow() {
         var mask = document.getElementById("mask");
         mask.style.display = "none";
         var o = document.getElementById("edit");
         o.style.display = "none";
     }
 </script>

div:

<div id="edit" style="display:none;position:absolute;z-index:100; border:solid 1px #79BCFF; background-color: #EEF2FB;  width:400px;height:200px;">
      <table id="table1"  width="400" cellpadding="0" cellspacing="0">
        <tr bgcolor="#A0D0F5">
        <td>
        <span style="float:right;margin-top:5px;"><a onclick="closeWindow();" style="cursor: pointer;float:right;">[关闭]</a></span>
        </td>
        </tr>
        <tr>
            <td>
                <div style="width:400px;height:180px; overflow-y:auto ; overflow-x:hidden ;" >
                   <ul>
                        <li style="list-style-type:none; width:140px;float:left;">项目1</li>
                       <li style="list-style-type:none; width:140px;float:left;">项目2</li>
                       <li style="list-style-type:none; width:140px;float:left;">项目3</li>
                        <li style="list-style-type:none; width:140px;float:left;">项目4</li>
                        <li style="list-style-type:none; width:140px;float:left;">项目5</li>
                        <li style="list-style-type:none; width:140px;float:left;">项目6</li>
                    </ul>
                </div>
            </td>
        </tr>
      </table>
</div>

 

     <div >    
      <a href="javascript:showWindow()">点击</a>
     </div>