关于dom节点绑定滑动事件导致浏览器上下滑动失效解决方案--黄丕巧
1、移动端开发往往需要添加一下自定义的左右滑动事件,但是添加了左右滑动事件之后就要阻止浏览器大默认事件,否则dom节点的滑动事件和浏览器本身的滑动会出现冲突,导致滑动的时候会出现消失瞬间再出现的效果
解决方案:event.preventDefault();//阻止浏览器默认事件即可
2、阻止浏览器默认事件之后发现这添加了滑动事件的dom节点上下滑动也失效,这是一个很坑爹的地方,如果你的活动dom节点占据了整块屏幕,也就是说你的页面上下动不了了;
解决方案:设置两个开关,分别对应左右滑动和上下滑动,即左右滑动的时候才阻止默认事件,上下滑动的时候并没有阻止,代码如下:
关于dom节点绑定滑动事件导致浏览器上下滑动失效解决方案--黄丕巧的更多相关文章
- 随笔一个dom节点绑定事件
以下利用jquery说明: js中,给一个dom节点绑定事件再平常不过了.这里说下,如果dom经常发生变化的话,给这个dom绑定事件的情况. 比如代码如下: li的节点,绑定了事件:点击会打出来里头的 ...
- Jquery 查看DOM上绑定的事件列表
$(dom).data( "events" ); 包括事件类型和关联的处理函数 下面是firefox的截图
- 给DOM元素绑定click事件也有学问
最简单的莫过于使用click方法: 1 <input id="btn" type="button" value="BUTTON" on ...
- 给echart初始化的dom节点绑定时间获取点击的值渲染省市区
this.drawMap().on('click', function (params) { var province = params.name; that.mapStatus = province ...
- 移动端表层div滑动,导致底层body滑动(touchmove的阻止)
body很长,可以滑动,body头部有一个模拟下拉的选择框,下拉选择有滚动轴 我给body一个overflow:hidden和高度是没有用的.手机网站上背景还是可以滑动,然后我给body一个touch ...
- ElementUI el-input标签 绑定keyup事件v-on:keyup.enter="convert"无效解决方案
期望实现,输入数字后,回车直接执行点击按钮"转换" 无效写法: <el-input v-model="input" placeholder="请 ...
- 移动端 uni-app 滑动事件 精确判断手指滑动方向
移动端根据手指滑动操作判断滑动方向 设计思路: 1.根据移动端touchstart和touchend方法获取手指触摸屏幕的开始坐标和结束坐标 2.根据两个坐标计算与水平方向的夹角 3.根据夹角判断当前 ...
- 浏览器中开发人员工具快速找到dom元素绑定那些JS事件
在web开发过程中难免会遇到让程序员去修改一些js代码东西,例如js的ajax和php等语言的交互等,在这其中你不得不了解点js的事件触发,且随着js的盛行各种插件的事件让程序员眼花缭乱,所以借助一个 ...
- 一个DOM元素绑定多个事件时,先执行冒泡还是捕获
绑定在被点击元素的事件是按照代码顺序发生,其他元素通过冒泡或者捕获“感知”的事件,按照W3C的标准,先发生捕获事件,后发生冒泡事件.所有事件的顺序是:其他元素捕获阶段事件 -> 本元素代码顺序事 ...
随机推荐
- java 反编译插件 JD-Eclipse 和 JD-IntelliJ
去官网 : http://jd.benow.ca/ 找到 JD-Eclipse 和 JD-IntelliJ,下载,前者安在eclipse上,后者安在as上.
- 转:java中scanner类的用法
声明:本文转自百度经验:http://jingyan.baidu.com/article/e73e26c0c74a1f24adb6a7fb.html Scanner是SDK1.5新增的一个类,可是使用 ...
- 9.6. MySQL中保留字的处理
尝试使用一个识别符,例如使用嵌入式MySQL 数据类型或函数名作为表名或列名,例如TIMESTAMP 或GROUP ,会造成一个常见问题.允许你这样操作( 例如,ABS 可以作为一个列名) .但是,默 ...
- SQL查询时间去除非工作日...
CREATE FUNCTION [f_WorkDayADD]( @date datetime, --基础日期 @workday int --要增加的工作日数 )RETURNS datetime AS ...
- Win7平台下Cocos2d-x环境搭建
一.Win7下Cocos2d-x环境搭建 Cocos开发者平台官网——在这里下载游戏引擎 解压放到某个目录下即可 https://www.python.org/downloads/ ...
- 《Qt 实战一二三》
简介 "我们来自Qt分享&&交流,我们来自Qt Quick分享&&交流",不管你是笑了,还是笑了,反正我们是认真的.我们就是要找寻一种Hold不住的 ...
- Android activity 周期图
- MVC项目中应用富文本编辑器UEditor中的几个坑
UEditor:百度出品 官网连接:http://ueditor.baidu.com/website/ 错误现象:在官网上复制到本地后,上传图片功能不能用, 控制台提示:“请求后台配置项http错误, ...
- HDU 1527 (Wythoff 博弈) 取石子游戏
对于Wythoff博弈中的两个数列,An和Bn有这样的关系: An + n = Bn, An = floor(φ * n) 所以我们可以根据a b的差值来计算一个新的a出来看看这两个值是否相等. 想等 ...
- DOM应用
父级.removeChild(子节点);父级.appendChild(子节点);父级.insertBefore(子节点, 在谁之前); 创建元素: <script> window.onlo ...