弹出 fixed 弹窗后,在弹窗上滑动会导致下层的页面一起跟着滚动。

关于阻止小程序弹框滑动的办法

场景1:弹窗内无滚动内容

可以在弹窗最外层元素绑定touchmove事件,触发事件返回false即(在vue类框架中也可以加.stop阻止冒泡)。

简单写法:catchtouchmove='true'

此种方式会阻止弹窗内所有内容的滚动。要记得慎用

需求场景:整屏展示,弹框内不存在滑动的需求

场景二:弹窗内有滚动内容

在弹窗外层根元素动态添加一个noScroll样式,定义noScroll{height: 100%; overflow: hidden;}

当需要阻止滑动的弹窗显示时添加noScroll,弹窗关闭去掉noScroll即可。

此种方式的缺点是当弹窗显示增加noScroll后弹窗下面的页面会回到顶部。

欢迎点赞,欢迎交流

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-01-18
  • 2022-12-23
  • 2022-02-25
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2021-11-23
  • 2021-12-07
  • 2022-02-02
  • 2022-01-22
  • 2021-12-05
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案