其他分享
首页 > 其他分享> > jquery 添加 遮罩层

jquery 添加 遮罩层

作者:互联网

页面中经常用到,记录一下

 

div

<div id="cover"><img src="/images/loading.gif" style="width: 80px; height: 80px;"/></div>

 

css

    #cover {
        position: absolute;
        left: 0px;
        top: 0px;
        background: rgba(0, 0, 0, 0.4);
        width: 100%; /*宽度设置为100%,这样才能使隐藏背景层覆盖原页面*/
        height: 100%;
        filter: alpha(opacity=60); /*设置透明度为60%*/
        opacity: 0.6; /*非IE浏览器下设置透明度为60%*/
        display: none;
        z-Index: 999;
    }
    #cover img{
        position:absolute;
        bottom:50%;
        right:50%;
        margin-left:40px;
        margin-top:40px;
    }

js

 $(document).ajaxStart(function () {
        $("#cover").css('display','block');
    });
    $(document).ajaxSuccess(function (e) {
        $("#cover").css('display', 'none');
    });
    $(function () {
        //设置全局 jQuery Ajax全局参数
        $.ajaxSetup({
            type: "POST",
            async: false,
            cache: false,
            dataType: "JSON",
            beforeSend: function () {
                console.log(4)
            },
            error: function (jqXHR, textStatus, errorThrown) {
                switch (jqXHR.status) {
                    case (500):
                        alert('服务器系统内部错误');
                        break;
                    case (401):
                        alert('未登录');
                        break;
                    case (403):
                        alert("无权限执行此操作");
                        break;
                    case (408):
                        alert("请求超时");
                        break;
                    case (404):
                        alert('地址错误');
                        break;
                    default:
                        alert("未知错误");
                }
            },
            success: function (data) {
                //alert('操作成功!');
                console.log(3);
            }
        })
    });

 

标签:jquery,遮罩,function,100%,cover,alert,break,case,添加
来源: https://www.cnblogs.com/lunawzh/p/15172130.html