繁体   English   中英

jQuery或Javascript中是否有方法确定touchmove事件的速度?

[英]Is there a way in jQuery or Javascript to determine the speed of a touchmove event?

这是一个简单的问题。 jQuery或Javascript中是否有方法确定touchmove事件的速度? 我使用css来抓取元素并使它可抓取,效果很好,但是如果我更快地移动手指,则我不太可能移动到阈值距离,但是我确实打算翻页,所以有没有办法确定javascript或jQuery中的touch move事件的运动速度,我可以将阈值调整为较小的值以补偿速度吗?

    var startX, endX, difference, threshold; 
var startTime, endTime, timeDiff = 151;
$('#animate')
.bind("touchstart", function (e){ 
    e.preventDefault();
    var d = new Date();      
    startTime = d.getTime();
    startX = e.originalEvent.touches[0].pageX; //starting point
    })
.bind("touchmove", function (e){
    e.preventDefault();
    endX =e.originalEvent.changedTouches[0].pageX; //Get the information for finger 
    difference = startX - endX;  //calculate the distance moved.
    var moved = minusScreen - difference; //determine the affected css value.
    $(this).css("left",moved);  //this makes the element moves with my finger.
    })
.bind("touchend", function (e) { 
    var date = new Date();
    endTime = date.getTime();
    threshold = Math.abs(difference);
    timeDiff = endTime - startTime;
    if ((threshold > (screenWidth * 0.4)) || (timeDiff < 150))  //make the animation move only when the finger moved more than 30% of the page.
        {           
        if (endX > startX) turnLeft();
        else if (endX == startX) {} // havent decide what to do yet 
        else turnRight();
    } else {
        $(this).animate({"left": minusScreen}, 100);
    }
    startX=0; //set the value back to initial.
    endX=0;   //set the value back to initial.});
    });

感谢您的出色回答。 以上是修改后的代码。 很棒!!!

像这样在touchstart上获得时间,在touchend上再次获得时间

startTime = new Date().getTime()endTime = new Date().getTime()

然后计算var speed = abs(endX-startX)/(endTime-startTime)这就是您现在的整体touchmove速度,以px / ms为单位

尽管这是一个古老的问题,但触摸事件对象中似乎有一个“ timeStamp”,因此简单地使用它可能会更简单,更快捷:

startTime = e.timeStamp();

代替:

var d = new Date();      
startTime = d.getTime();

var endTime也一样

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM