遮罩层，和正在加载中

jsp中实现loading效果，带遮罩层的实现方法如下：

var MaskUtil = (function(){  

    var $mask,$maskMsg;  

    var defMsg = '正在处理，请稍待。。。';  

    function init(){  

        if(!$mask){  

            $mask = $("<div class=\"datagrid-mask mymask\"></div>").appendTo("body");  

        }  

        if(!$maskMsg){  

            $maskMsg = $("<div class=\"datagrid-mask-msg mymask\">"+defMsg+"</div>")  

                .appendTo("body").css({'font-size':'12px'});

        }  

          

        $mask.css({width:"100%",height:$(document).height()});  

          

        $maskMsg.css({  

            left:($(document.body).outerWidth(true) - 190) / 2,top:($(window).height() - 45) / 2,

        });   

                  

    }  

    return {  

        mask:function(msg){  

            init();  

            $mask.show();  

            $maskMsg.html(msg||defMsg).show();  

        }  

        ,unmask:function(){  

            $mask.hide();  

            $maskMsg.hide();  

        }  

    }  

}());  

需要用到的css样式：

.datagrid-mask-msg {

  position: absolute;

  top: 50%;

  margin-top: -20px;

  padding: 12px 5px 10px 30px;

  width: auto;

  height: 16px;

  border-width: 2px;

  border-style: solid;

  display: none;

}

实现的效果：