小程序 scroll-view滑动穿透问题

这几天公司有一个小程序项目要写,其中有一个需求是这样的:


小程序 scroll-view滑动穿透问题_第1张图片



小程序 scroll-view滑动穿透问题_第2张图片


用户点击的时候弹出遮挡层,当用户滑动的时候会造成滑动穿透,为了解决这个问题百度了好几个小时,头疼。

不废话,上方法:


小程序 scroll-view滑动穿透问题_第3张图片

让这个整体不超过设备的显示的高度,也就是说不让滚动轴显示出来,而滑动的时候只是滑动scroll-view区域

当遮罩层出来的时候,滑动遮罩层里面的scroll-view的时候,给底部的scroll-view设置上ovflow:hidden,这样底部的scroll-view就不会滑动,


思路:

    遮挡层里面的scroll-view滑动时候,给底层scroll-view设置ovflow:hidden, 底层的scroll-view的高度+其他高度不能超过屏幕显示的高度(因为超过page就会显示滚动条)

如果有透明的背景,需要给背景加上catchtouchmove事件(阻止在透明背景滚动穿透)

你可能感兴趣的:(小程序 scroll-view滑动穿透问题)