美文网首页
手机滑动事件

手机滑动事件

作者: 三九而成 | 来源:发表于2018-04-19 19:34 被阅读0次

移动端,弹出层经常会出现,在弹出层触摸滑动,弹出层下面的body也跟着滑动。

出现这个事情的原因:当我们触摸手机屏幕上下滑档的时候,这个事件是会传递到body上面,也就是事件冒泡。而页面所有的内容都在body里面,如果页面里面的内容超过一屏的高度,撑开了body的高度,body会跟着滑动。

类似这样的html结构,即便body的高度是一屏,但是被内容撑开了,也是会滑动。

这只是一种原因。

最关键的还是,滑动的事件冒泡到了body层,从而触发了body的滑动。

原因找到了,那么只需要不触发body的滑动,那么阻止事件冒泡,或者更改css让内容不撑开body都可以解决滑动的问题。

现在滑动绝对定位的div,body高度因为没有被内容撑开,所以body无法滑动,而需要滑动的内容和绝对定位的div是平级的,所以触发不了滑动事件。

相关文章

  • 手机滑动事件

    移动端,弹出层经常会出现,在弹出层触摸滑动,弹出层下面的body也跟着滑动。 出现这个事情的原因:当我们触摸手机屏...

  • 混合开发手机左右滑动

    混合开发手机左右滑动 1、h5无法阻止手机左右滑动事件 系统的事件比webview事件的优先级更高,即使在onto...

  • 追_沐 iOS UITouch触摸与UIGesture手势.0

    一、iOS事件:1.事件:事件就是当你在手机上点击手机屏幕、滑动手机翻面、摇动手机的时候,手机做出一些反应,对应的...

  • iOS 事件处理

    iOS事件分类: 1. 触摸事件 - 手指点击,滑动,拖拽,捏合等都属于触摸事件 2. 加速计事件 - 手机摇晃等...

  • Android系统知识全览---View知识体系(2)---Vi

    View的事件体系 View的概念 View的事件 View的滑动事件 View事件分发机制 View的滑动冲突解...

  • 滑动事件

    .box{width:100%;height: 100%;position: fixed;margin:auto;...

  • 自定义ScrollView

    scrollview最外层,当滑动的距离到一定程度(阈值,可指定值)才拦截滑动事件,否则 其内部子控件消费滑动事件

  • Android滑动事件冲突解决方法

    1.Android滑动事件冲突解决办法 滑动事件的冲突包括两种情形: 不同方向的滑动冲突:比如ScrollView...

  • 自动化工具-ADB

    ADB命令在手机端的自动化控制和处理 1. Android adb 模拟滑动 按键 点击事件 模拟事件全部是通过i...

  • react 中列表实现左滑删除

    基本布局实现: 定义屏幕触摸开始事件,滑动中事件,以及滑动结束的事件,允许向左滑动80px,而且同一时间只能有一条...

网友评论

      本文标题:手机滑动事件

      本文链接:https://www.haomeiwen.com/subject/nvhgkftx.html