H5当弹出弹窗遮罩时如何阻⽌滚动穿透（使⽤css⽅式）最终解决⽅案：使⽤当弹窗出现的时候将页⾯body的position设置为fixed并记录此刻滚动的位置，弹窗消失去除position属性
遮罩层显⽰
onInviteFriendClick() {
this.viewState.shareCover.visible = true;
//遮罩出现不可以滚动
let scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
document.body.style.cssText += 'position:fixed;width:100%;top:-' + scrollTop + 'px;';
}
遮罩层关闭 -----点击使遮罩消失
onVisibleClick = () => {
const oldVisible = this.viewState.shareCover.visible;
Object.assign(this.viewState, {
shareCover: {
visible: !oldVisible
}
css中的position属性});
//去除遮罩恢复滚动
if (!this.viewState.shareCover.visible) {
let body = document.body;
body.style.position = '';
let top = p;
document.body.scrollTop = document.documentElement.scrollTop = -parseInt(top);
p = '';
}
};
参考⽹址：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。