jquery判断手指滑动方向
jquery判断手指滑动方向
<pre>
/*判断哪个滑动方向还是自己改下 要么上下 要么左右*/
var startX;
var startY;
$(".shanghua").on("touchstart", function(e) {
// 判断默认行为是否可以被禁用
if (e.cancelable) {
// 判断默认行为是否已经被禁用
if (!e.defaultPrevented) {
e.preventDefault();
}
}
startX = e.originalEvent.changedTouches[0].pageX;
startY = e.originalEvent.changedTouches[0].pageY;
console.log('startX:' + startX);
console.log('startY:' + startY);
});
$(".shanghua").on("touchend", function(e) {
// 判断默认行为是否可以被禁用
if (e.cancelable) {
// 判断默认行为是否已经被禁用
if (!e.defaultPrevented) {
e.preventDefault();
}
}
var moveEndX = e.originalEvent.changedTouches[0].pageX;
var moveEndY = e.originalEvent.changedTouches[0].pageY;
console.log('moveEndX:' + moveEndX);
console.log('moveEndY:' + moveEndY);
var X = moveEndX - startX;
var Y = moveEndY - startY;
//下滑
if (Y > 0) {
alert('下滑');
}
//上滑
else if (Y < 0) {
alert('上滑');
}
});
</pre>
jquery判断手指滑动方向的更多相关文章
- 《移动端浏览器Touch事件判断手指滑动方向方法》
$("body").on("touchstart", function(e) { e.preventDefault(); startX = e. ...
- 对于移动端浏览器touch事件的研究总结(4)判断手指滑动方向
最近有一些微信的项目,虽然页面很简单,但配合手势后的效果却是很不错的.最基本的效果就是手指向上滑,页面配合css3出现一个展开效果,手指向下滑将展开的内容按原路径收起.其实就是一个简单的判断手指滑动方 ...
- 移动端 uni-app 滑动事件 精确判断手指滑动方向
移动端根据手指滑动操作判断滑动方向 设计思路: 1.根据移动端touchstart和touchend方法获取手指触摸屏幕的开始坐标和结束坐标 2.根据两个坐标计算与水平方向的夹角 3.根据夹角判断当前 ...
- web移动前端页面,jquery判断页面滑动方向
/*判断上下滑动:*/ $('body').bind('touchstart',function(e){ startX = e.originalEvent.changedTouches[0].page ...
- js判断手指滑动方向(移动端)
var startx, starty; //获得角度 function getAngle(angx, angy) { return Math.atan2(angy, angx) * 180 / Mat ...
- jquery 判断手势滑动方向(上下左右)
$('body').on('click', '.placeholder img', function(e) { //touchstart在你之前发生,不管些什么,都先执行下面的 }); $('body ...
- 用HTML和javascript(JS)计算触屏手机手指滑动方向的演示
移动终端的流行,程序员希望通过HTML+JS完成触屏动作的识别.下面给出具体实现的例子,供大家参考. 将下面的代码复制并保存,用手机访问,现在的手机浏览器一般都支持触屏,针对本演示来讲就是支持三个js ...
- js判断元素滑动方向(上下左右)移动端
每天学习一点点. 1 var startx, starty; //获得角度 function getAngle(angx, angy) { return Math.atan2(angy, angx) ...
- 判断listview滑动方向的代码片段
mListView.setOnScrollListener(new OnScrollListener() { private int lastIndex = 0; @Override public v ...
随机推荐
- VM虚拟机启动夜神模拟器卡99%解决办法
VM虚拟机启动夜神模拟器卡99%解决办法 本人出现的情况: 物理机装的是win7系统,安装了vmware14(安装过程未出现报错),在vmware14 上 win10系统(安装过程未出现报错),安装夜 ...
- 彻底修改eclipse中项目的名称
需要四个步骤: 一.右键工程:Refactor->Rename,或选中工程按F2,修改名称 二.修改项目目录下:.project文件 三.项目右键属性 --> Web Project Se ...
- 调用对象 “ha-datastoresystem”的“HostDatastoreSystem.QueryVmfsDatastoreCreateOptions” 失败。
VMware vSphere Client上显示:在 ESXi“10.10.10.3”上调用对象 “ha-datastoresystem”的“HostDatastoreSystem.QueryVmfs ...
- powershell(一)
Windows powershell是一种命令行外壳程序和脚本环境,它内置在win7以上版本的操作系统中,使命令行用户和脚本编写者可以利用.NET Framework的强大功能.powershell程 ...
- go-select
select语句属于条件分支流程控制方法,不过它只能用于通道. select语句中的case关键字只能后跟用于通道的发送操作的表达式以及接收操作的表达式或语句. ch1 := make(chan ) ...
- windows 抓hash获取管理员密码
webshell 找能执行权限的目录上传 C:\Windows\System32\config\sam 内有windows 密码 利用工具把密码抓出来 samcopy 直接抓取 GetHASHES.e ...
- 基础安全术语科普(六)——exploit
exploit (漏洞利用) 利用漏洞存在两种攻击形式: 1.Remote(远程):利用系统漏洞来获得访问权限. 2.local(本地):需要对系统进行物理访问来实现攻击. 如何发现漏洞? 利用逆向工 ...
- 基准测试了 ArrayList 和 LinkedList ,发现我们一直用 ArrayList 也是没什么问题的
ArrayList 应该是 Java 中最常用的集合类型了,以至于我们说到集合就会自然而然的想到 ArrayList.很多同学都没有用过除了 ArrayList 之外的其他集合,甚至于都已经忘了除了 ...
- 为什么说HttpMessageConverter的顺序非常重要_SpringBoot
问题描述 系统内配置了,ProtobufJsonFormatHttpMessageConverter和FastJsonHttpMessageConverter. Spring官方内置的默认Messag ...
- 总结Java equals()和hashCode()的联系
Java equals()和hashCode()的联系 如果两个对象是相等的,那么它们必须有相同的哈希码. 如果两个对象具有相同的哈希码,他们可能相等,可能不相等. 如果两个对象是不同的类的实例 他们 ...