问答

ios滑动穿透问题?外边页面,弹窗里边均可滚动?

作者:admin 2021-05-15 我要评论

ios滑动穿透问题?外边页面,弹窗里边均可滚动?在弹窗里边滑动会影响到底层页面这种情况怎么修改? ### 借机科普一个 CSS 新属性 overscroll-behavior: contain...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

image.png
ios滑动穿透问题?外边页面,弹窗里边均可滚动?在弹窗里边滑动会影响到底层页面这种情况怎么修改?

###

借机科普一个 CSS 新属性 overscroll-behavior: contain; 正是用来处理滚动越界行为的。

https://caniuse.com/?search=o...
https://developer.mozilla.org...

嗯,Android Chrome 新版已经支持了,可惜 iOS 目前还不支持,你可以加一小段 js 做 polyfill, scroll 的时候判断如果到两端了就 preventDefault, 不难。

demo: https://mdn.github.io/css-exa...

###

你这个弹窗是叠加在页面上的吗?你看下这篇https://www.cnblogs.com/yflbk...

###

移动端主要就是ios兼容多嘛,正常;
弹框有滚动条滑动带动页面,也只能js来解决,如楼上所说:记录下起始位置,判断是否滑动到底部或者顶部,然后设置preventDefault

###

目前的做法是监听弹窗的遮罩层和 滚动内容的滑动 touchmove , touchstart 事件,根据触发的target来判断是否要禁止默认事件的触发和传递。

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 请问下prometheus怎么进行自定义的按业

    请问下prometheus怎么进行自定义的按业

  • 节流函数为什么,点击无效,监听窗口大

    节流函数为什么,点击无效,监听窗口大

  • express访问静态资源失败

    express访问静态资源失败

  • IE 浏览器下 match 方法报错

    IE 浏览器下 match 方法报错

腾讯云代理商
海外云服务器