1 --- html
//阴影
2 css
#popUpBox{
display: block;
width: 800px;
height: 330px;
background-color: #eee;
margin: 0 auto;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 532px;
z-index: 3;
border-radius: 8px;
}
#bgPox{
width: 100%;
height: 100%;
text-align: center;
background-color: rgba(0, 0, 0, 0.74);
position: absolute;
top: 0;
left: 0;
font-size: 1.3rem;
color: #fff;
line-height: 8rem;
z-index: 3;
}
.detailInfo{
display: flex;
justify-content: space-between;
margin: 50px 30px;
font-size: 23px;
color: #000;
}
.endContent{
font-size: 23px;
color: #000;
margin-left: 30px;
}
3----js
function showBox(){
$(window).scrollTop(0) //显示弹窗滚动到顶部
$("#topHtml").css("overflow","hidden"); //隐藏html滚动条
$("#popUpBox").show()
$("#bgPox").show()
}
function hideBox(){
$("#topHtml").css("overflow","auto");
$("#popUpBox").hide()
$("#bgPox").hide()
}
$(document).ready(function(){
// let template = ''
// $('.sss').html(template);
//$('#btn').modal()
let template2 = ''
for(let i = 0; i<3; i++){
template2 += `
查看详情
`
}
$('.staffListWrap').html(template2)
})
})