頁面遮罩層

<div id="pageloadingright" class="pageloadingright">
    </div>
    <div id="pageloading" class="pageloading">
        <div class="loader-inner">
        </div>
    </div>

.pageloading {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 20000
}

    .pageloading .loader-inner {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        width: 60px;
        height: 60px;
        vertical-align: middle;
        background: url('images/loading_80x80.gif') no-repeat center center;
        background-size: cover;
    }

.pageloadingright {
    display: none;
    position: fixed;
    right: 0;
    width: 20px;
    height: 20px;
    z-index: 10000;
    background: url('images/loading_32x32.gif') no-repeat center center;
    background-size: cover;
}
 

 (function (window, $, undefined) {     
 var _Core = function () {
  var _loading = function () {
            this.AjaxLoadingStart = function () {
                $("#pageloadingright").fadeIn();
            };

            this.HideAjaxLoading = function () {
                $("#pageloadingright").fadeOut(500);
            };

            this.HidePageLoading = function () {
                $("#pageloading").fadeOut(500);
            }

            this.HideAll = function () {
                this.HideAjaxLoading();
                this.HidePageLoading();
            }

        };
        this.Loading = new _loading();
        /**
         * 頁面所有ajax加在完畢後執行
         * @param {function()} func 回撥函式
         */
        this.OnPageLoad = function (func) {
            if (func !== undefined)
                _OnPageLoad = func;
        };

        var pageLoad = function () {
            if (_OnPageLoad)
                _OnPageLoad();
        };
        $(function () {
            var _interval = setInterval(function () {
                //if
                if (!window.ajaxruning) {
                    clearInterval(_interval);
                    pageLoad();
                }
            }, 100);
            $Core.ValidPage();
            $Core.ValidAction();

        });
    };
    window.$Core = new _Core();

})(window, jQuery);



 

        $Core.OnPageLoad(function () {
            $Core.Loading.HidePageLoading();
        });