jQuery -- touch事件之滑动判断(左右上下方向)
$("body").on("touchstart", function(e) {
// 判断默认行为是否可以被禁用
if (e.cancelable) {
// 判断默认行为是否已经被禁用
if (!e.defaultPrevented) {
e.preventDefault();
}
}
startX = e.originalEvent.changedTouches[0].pageX,
startY = e.originalEvent.changedTouches[0].pageY;
});
$("body").on("touchend", function(e) {
// 判断默认行为是否可以被禁用
if (e.cancelable) {
// 判断默认行为是否已经被禁用
if (!e.defaultPrevented) {
e.preventDefault();
}
}
moveEndX = e.originalEvent.changedTouches[0].pageX,
moveEndY = e.originalEvent.changedTouches[0].pageY,
X = moveEndX - startX,
Y = moveEndY - startY;
//左滑
if ( X > 0 ) {
alert('左滑');
}
//右滑
else if ( X < 0 ) {
alert('右滑');
}
//下滑
else if ( Y > 0) {
alert('下滑');
}
//上滑
else if ( Y < 0 ) {
alert('上滑');
}
//单击
else{
alert('单击');
}
});
转载http://blog.csdn.net/sinat_19327991/article/details/73823767
jQuery -- touch事件之滑动判断(左右上下方向)的更多相关文章
- 移动端笔记——jQuery touch事件
判断移动端还是pc端 function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = new Array("A ...
- H5案例分享:移动端touch事件判断滑屏手势的方向
移动端touch事件判断滑屏手势的方向 方法一 当开始一个touchstart事件的时候,获取此刻手指的横坐标startX和纵坐标startY: 当触发touchmove事件时,在获取此时手指的横坐标 ...
- html5 touch事件实现触屏页面上下滑动(二)
五一小长假哪都没去,睡了三天,今天晕晕沉沉的投入工作了,但还是做出了一点点效果 上周用html5的touch事件把简单的滑动做出来了,实现了持续页面上下滑动的效果,参考之前 的文章及代码html5 t ...
- 前端touch事件方向的判断
移动端touch事件判断滑屏手势的方向 方法一 当开始一个touchstart事件的时候,获取此刻手指的横坐标startX和纵坐标startY: 当触发touchmove事件时,在获取此时手指的横坐标 ...
- jquery mobile Touch事件
Touch事件在用户触摸屏幕(页面)时触发 1.jquery mobile tap tap事件在用户敲击某个元素时触发 $("p").on("tap",fucn ...
- 实现移动端touch事件的横向滑动列表效果
要实现手机端横向滑动效果并不难,了解实现的原理及业务逻辑就很容易实现.原理:touchstart(手指按下瞬间获取相对于页面的位置)——>touchmove(手指移动多少,元素相应移动多少). ...
- html5 touch事件实现触屏页面上下滑动(一)
最近做的做那个app的项目由于用overflow:hidden导致了很多问题,于是决定研究下html5的touch事件.想找个全面点的帖子真是难死了,虽然好多关于html5 touch的文章但大多都是 ...
- Android中Touch事件分析--解决HorizontalScrollView滑动和按钮事件触发问题
之前写过关于HorizontalScrollView滑动和按钮事件触发问题,但是不能所有的情况,最近几天一直在想这个问题,今天有一个比较好的解决思路,最终应用在项目里面效果也很好,首先说明一下功能: ...
- js Touch事件(向左滑动,后退)
js Touch事件(向左滑动,后退) 代码如下 var touch_p = { c_x : 0, c_y : 0, hasbacked : false }; function touches(ev) ...
随机推荐
- Restful framework【第七篇】权限组件
基本使用 -写一个类: class MyPer(BasePermission): message='您没有权限' def has_permission(self, request, view): # ...
- 百度地图bd map使用方法
一个经验:(当项目中的方法, 很多的时候, 相互调用的时候) 可以在script中, 先定义, 注意是定义, 一个"入口"函数, function initMap(), 然后, 让 ...
- Trim Galore用法及参数考量
Trim Galore是一个非常流行的用于「去接头序列」的软件,用于处理高通量测序得到的原始数据.通常我们从测序公司拿到数据后,第一步就是评估数据的质量以及对raw data去接头处理.公司拿来的数据 ...
- Hive command
hive常用命令 Hadoop Hive概念学习系列之hive里的分区(九) DOC hive分区(partition)简介 Hive分区(静态分区+动态分区) Hive分区.分桶操作及其比较 hiv ...
- Linux 下上手 STC89C52RC
第一次接触单片机,自然选择了简单的51单片机.然而我的操作系统是 Linux .在 Windows 下上手51似乎很容易.但是 Linux 上搭建 51 开发环境不是很顺. 那么谈谈 Linux 我如 ...
- Centos6.5 搭建LAMP环境
1.Centos6.5 处于对安全的考虑,严格控制网络的进去.所以安装 Apache 或 MySQL 的时候,需要开放 80 或 3306 端口 首先,执行如下命令查看当前防火墙开放了哪些端口: [ ...
- java中垃圾回收算法讲解
判断对象是否存活的方法: 一.引用计数算法(Reference Counting) 介绍:给对象添加一个引用计数器,每当一个地方引用它时,数据器加1:当引用失效时,计数器减1:计数器为0的即可被回 ...
- PHP中SESSION自定义会话管理器
<?php class CustomSession implements SessionHandlerInterface{ private $link; private $lifetime; p ...
- C# winform窗体间传值(使用委托或事件)
窗体间传值 今天得空,刚好看到网上好多人再找winform窗体间传值的问题,由于昨天项目的优化的感觉不错,就写了个C# winform窗体间传值的demo,希望能给需要的人的带来帮助: 工程的源代码地 ...
- C#端加载数据库,Combobox与Node控件绑定数据源demo示例
最近一直在做网页.用的js比较多,最近需要做一个C#相关的demo,一开始还有点不适应,写了几句有点感觉了 本篇博客的主要内容是C#怎么读取数据库文件里的数据以及相关控件如何绑定数据源,所做的Demo ...