2015-11-10 80 views
1

我想檢測手機上的滾動/觸摸方向。對於桌面,我使用.on('DOMMouseScroll').('mousewheel'),但這在手機上不起作用。 頁的正文是overflow: hidden;任何人都知道如何檢測此?溢出時的移動滾動方向檢測:隱藏頁面

+0

是否使用JQM?它有'scrollstart'和'scrollstop'的一些虛擬事件。 https://api.jquerymobile.com/category/events/ – Twisty

回答

0

看來我陷入了你的情況。

因爲我需要大量的研究,把所有東西放在一起,我在這裏張貼了一切:

if (Modernizr.touch) { 
    // Determining swipe direction 
    // http://stackoverflow.com/a/22257774/1064325 
    var touchStartY; 
    document.addEventListener('touchstart', function (e){ 
     touchStartY = e.touches[0].clientY; 
    }, false); 

    // Preventing iOS end of page bounce effect 
    // http://stackoverflow.com/a/7771215/1064325 
    document.addEventListener('touchmove', function (e){ 
     e.preventDefault(); 
    }, false); 

    document.addEventListener('touchend', function (e){ 
     var touchEndY = e.changedTouches[0].clientY; 
     if (touchStartY > touchEndY + 5) { 
      // NEXT 
     } else if (touchStartY < touchEndY - 5) { 
      // PREV 
     } 
    }, false); 
} else { 
    // Handling wheeling properly 
    // http://stackoverflow.com/a/3515490/1064325 
    var deltaWheel = 0; 
    var wheelTimeout = 0; 
    document.addEventListener('wheel', function(event) { 
     deltaWheel += event.deltaY; 
     clearTimeout(wheelTimeout); 
     wheelTimeout = setTimeout(function() { 
      if (deltaWheel < -5) { 
       // PREV 
      } 
      if (deltaWheel > +5) { 
       // NEXT 
      } 
      deltaWheel = 0; 
     }, 50); 
    }); 
}