关于移动端弹窗内容滚动底部页面不滚动的问题

阅读 44

2022-02-10

1.弹窗内容区不需要滚动

直接在touchmove事件中设置e.preventDefault();阻止默认事件,这样底部就不会滚动。但是弹窗内容也不会滚动了。

2.弹窗内容区需要滚动

显示弹窗时,让下面的页面 fixed 定位,弹窗消失时候,再还原 relative 定位。

.fixed {
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
}

<div
  :class="{
    'fixed': modalShow
  }">
</div>

精彩评论(0)

0 0 举报