css+js+html实现的遮罩

——————页面遮罩（CSS+JS+HTML）——————

HTML：

1 <div id="mask" class="mask"></div>

CSS：

/***********-  遮罩层  -***********/
#mask{
            position: absolute;
            top: 0px;
            left:0px;
            background:#333;
            opacity:0.5;
            /* older safari/Chrome browsers */
           -webkit-opacity: 0.5;
           /* Netscape and Older than Firefox 0.9 */
           -moz-opacity: 0.5;
           /* Safari 1.x (pre WebKit!) 老式khtml内核的Safari浏览器*/
                 -khtml-opacity: 0.5;
             /* IE 4-9 */

            filter:alpha(opacity=50);
            /*This works in IE 8 & 9 too*/
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
            z-index:100;
            display:none;

        }

JS(JQuery):获得页面高宽，显示遮罩

1 function showMask(){
2   $("#mask").css("height",$(document).height());
3   $("#mask").css("width",$(document).width());
4   $("#mask").show();
5 }