弹框蒙层下面的内容超出一屏时,你底部内容可以滑动

最近项目中遇到个问题,弹框谈起时,如果蒙层底部内容比较多,滑动蒙层是,底部内容也会滑动,

只找到一些不完美的解决方法,如果您有更合适的方法可以提出来哦

1、方法一:使用overflow:hidden;

 当弹框弹起时为底部内容添加overflow:hidden;样式,关闭时去除相关样式,这个方法的缺点是:

 存在的问题:弹框弹起时底部内容会回顶部,关闭时也在顶部。

 解决方案:有个笨拙的解决方案是,弹框弹起时,记录页面内容滚动的位置,关闭时自动回到弹起时的位置。

这个方法微信小程序、支付宝小程序、h5、app都可用

 2、方法二:@touchmove.stop.prevent="moveHandle" 

 touchmove事件:当手指在屏幕上滑动的时候连续地触发。在这个事件发生期间,调用preventDefault()事件可以阻止滚动。

存在的问题:弹框中的内容也无法滑动。现在暂无解决方案

 

posted @ 2021-07-12 16:38  无忧lv  阅读(366)  评论(0编辑  收藏  举报