欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

移动端判断手势滑动方向的方法

程序员文章站 2022-03-16 16:48:34
...

移动端有swipe方法,指的是手势的滑动方向
封装一个函数来判断手势是左滑还是右滑

// 这里判断手势是左滑还是右滑
var bindSwipeEvent = function(dom,leftCallback,rightCallback){
	var isMove = false;  // 判断是否存在滑动行为
	var startx = 0;
	var distance = 0;
	dom.addEventListener('touchstart',function(e){
		startx = e.touches[0].clientX;
	});
	dom.addEventListener('touchmove',function(e){
		isMove = true;
		var movex = e.touches[0].clientX;
		distance = movex - startx;
	});
	dom.addEventListener('touchend',function(e){
		// 判断条件:  发生了滑动行为,滑动距离超过50px
		if(isMove==true&&Math.abs(distance)>50){
			if(distance>0){
				leftCallback&&leftCallback(this);
			}else{
				rightCallback&&rightCallback(this);
			}
		}
	});
}
相关标签: 手势