首頁猿問在iPhone和Android上通...

在iPhone和Android上通過JavaScript檢測手指滑動

JavaScript Swift Android

慕標琳琳 2019-08-29 09:01:55

在iPhone和Android上通過JavaScript檢測手指滑動如何檢測用戶使用JavaScript在網(wǎng)頁上向某個方向滑動手指？我想知道是否有一個解決方案適用于iPhone和Android手機上的網(wǎng)站。

查看完整描述

3 回答

PIPIONE

TA貢獻1829條經(jīng)驗獲得超9個贊

簡單的vanilla JS代碼示例：

document.addEventListener('touchstart', handleTouchStart, false);        document.addEventListener('touchmove', handleTouchMove, false);var xDown = null;                                                        var yDown = null;function getTouches(evt) {
  return evt.touches ||             // browser API
         evt.originalEvent.touches; // jQuery}                                                     function handleTouchStart(evt) {
    const firstTouch = getTouches(evt)[0];                                      
    xDown = firstTouch.clientX;                                      
    yDown = firstTouch.clientY;                                      };                                                function handleTouchMove(evt) {
    if ( ! xDown || ! yDown ) {
        return;
    }

    var xUp = evt.touches[0].clientX;                                    
    var yUp = evt.touches[0].clientY;

    var xDiff = xDown - xUp;
    var yDiff = yDown - yUp;

    if ( Math.abs( xDiff ) > Math.abs( yDiff ) ) {/*most significant*/
        if ( xDiff > 0 ) {
            /* left swipe */ 
        } else {
            /* right swipe */
        }                       
    } else {
        if ( yDiff > 0 ) {
            /* up swipe */ 
        } else { 
            /* down swipe */
        }                                                                 
    }
    /* reset values */
    xDown = null;
    yDown = null;                                             };

在Android中測試過。

反對回復 2019-08-29