做网站项目大多就是用到juqeuy,下面用js写一个类似于小程序的loading提示。
首页先创建一个公共js,和css。
//弹窗提示
function isopen(i) {
$('.popup').remove() //这里对应下面 append的class名字 先删除再显示
$('body').append("<div class='popup'><div class='title' id='opentit'>" + i + "</div></div>")
$(".popup").fadeIn('slow', function () { //展示 1.5s后隐藏
setTimeout(() => {
$(".popup").fadeOut();
}, 1500)
})
}
.popup{
position: fixed;
z-index: 1;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
z-index: 999999;
}
.popup .title{
min-height: 40px;
background-color: rgba(0, 0,0, 0.8);
border-radius: 8px;
color: #fff;
padding: 14px 30px;
line-height: 40px;
}
让后页面引入js和css就可以直接使用了。看下效果。