手指滑动屏幕原理

//手指按下屏幕的点,抬起手指的点,按下的时间,抬起的时间

var startPoint=0;  

      endPoint=0;

      startTime=0;

   endTime=0;

//touchstart事件

$(".xx").on("touchstart",function(event){

//每次重新滑动要清除上一次手指抬起的位置和时间

endPoint=0;

endtime=0;

 startPoint=event.touches[0].clientY;

 startTime=Date.now()

})

//touchend事件

$(".xx").on("touchend",function(event){

 endPoint=event.touches[0].clientY;

 endTime=Date.now()

})

//判断滑动的速度是否超过指定值,超过就触发方法

var speed=(endPonit-startPoint)/[(endtime-starttime)/1000]

*获取的时间是毫秒,得出的速度是小数,所以要转换成秒;

*往上滑动屏幕,两点之间的差永远是负数,所以下面>20或者<-20

*如果要滑动不费力把参考值设置小一点

if(speed>20){

  xx();//调用方法,一般是翻页

}

转载于:https://www.cnblogs.com/5-clay/p/7851452.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值