首页 > 其他 > 详细

手指滑动屏幕原理

时间:2017-11-17 15:39:36      阅读:232      评论:0      收藏:0      [点我收藏+]

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

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();//调用方法,一般是翻页

}

手指滑动屏幕原理

原文:http://www.cnblogs.com/5-clay/p/7851452.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!