loading 遮罩层

全栈程序员站长

发布于 2022-07-29 13:03:10

1.5K0

发布于 2022-07-29 13:03:10

大家好，又见面了，我是你们的朋友全栈君。

JS代码片段

//数据请求方法
var dom = $("#loading").length;
if(!dom){
    $("body").append("<div id='loading'></div>");
}
$("#loading").show();
//开始请求
...
...
...
//如果正常
$("#loading").hide();

对应的CSS设置

#loading { background: rgba(0,0,0,.5) url(../images/XXX.gif) no-repeat center center; width: 100%; height: 100%; position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 999999; display: none; filter: alpha(opacity=50); }

这种方式可以将Ajax请求重新封装成自定义的方法，并将以上代码嵌入里面则一劳永逸。

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/129199.html原文链接：https://javaforall.cn

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2022年4月1，如有侵权请联系 cloudcommunity@tencent.com 删除

java