1

これは簡単な質問です。jQueryまたはJavascriptにtouchmoveイベントの速度を決定する方法はありますか？cssを使用して要素を取得し、取得可能にします。これは正常に機能しますが、指を速く動かすと、しきい値の距離に移動できる可能性は低くなりますが、ページをめくるつもりだったので、 javascriptまたはjQueryのタッチ移動イベントでの移動速度。速度を補正するためにしきい値を小さい値に調整できますか？

    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.});
    });

あなたの素晴らしい答えに感謝します。上記は変更されたコードです。うまくいきました!!!

4

2 に答える 2

8

このようにタッチスタートとタッチエンドで時間を取得します

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

次に、これを計算var speed = abs(endX-startX)/(endTime-startTime)して、全体的なタッチムーブ速度をピクセル/ミリ秒で表示します

于 2012-06-12T12:20:06.567 に答える
3

これは古い質問ですが、タッチイベントオブジェクトに「timeStamp」があるようです。そのため、単純に使用する方が簡単で高速な場合があります。

startTime = e.timeStamp();

代わりに ：

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

varendTimeについても同じです

于 2015-10-23T11:55:13.690 に答える