检测触摸向上或向下滚动答案

【问题标题】：Detect touch scroll up or down检测触摸向上或向下滚动
【发布时间】：2016-04-13 11:10:25
【问题描述】：

我需要与触控设备相同的代码。请帮帮我

$(window).on('DOMMouseScroll mousewheel', function (e) {
    if (ScrollEnable) {
        if (e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) {
            console.log('Down');
        } else {
            console.log('Up');
        }
    }
    return false;
});

这是我的触摸代码，但领事只是拿起我需要找到我的网站！我能做什么：|

$('body').on({
    'touchmove': function(e) {
        if (e.originalEvent.touches > 0 || e.originalEvent.touches > 0) {
            console.log('Down');
        } else {
            console.log('Up');
        }
    }
});

【问题讨论】：

hammerjs.github.io
你需要检测touch事件...不是鼠标事件..
@RayonDabre 阅读说明好吗？我需要与触摸设备相同的代码
好的，人家不是来给你免费服务的！向我们展示您在touch-devices 的上下文中尝试过的内容以及哪些无效...
jQuery-Mobile 是一个 FRAMKEWORK 它不是“如何在移动设备上使用 jQuery”。添加前请阅读tag info。

标签： javascript jquery scroll touch

【解决方案1】：

var updated=0,st;
$('body').on({
    'touchmove': function(e) { 
    st = $(this).scrollTop();
    if(st > updated) {
        console.log('down');
    }
    else {
        console.log('up');
    }
    updated = st;
    }
});

【讨论】：

【解决方案2】：

你可以使用滚动事件

var lastScrollTop = 0;
$(window).scroll(function(event){
var st = $(this).scrollTop();
if (st > lastScrollTop){
   // downscroll code
} else {
  // upscroll code
}
lastScrollTop = st;
});

【讨论】：

请注意，这是通过任何方式检测到窗口已滚动。这对于许多用例来说都是完美的。但或者，您可能只寻找用户启动的滚动，例如，如果您的应用也执行代码启动的滚动，例如 element.scrollIntoView()。在这种情况下，您需要检测几个单独的事件：DOMMouseScroll(firefox)、mousewheel(chrome/most others)、touchmove(mobile)。还有其他的吗？

【解决方案3】：

我知道我的解决方案更通用 - 它不依赖于任何元素，但它可能会帮助遇到与我相同问题的人。

var touchPos;

// store the touching position at the start of each touch
document.body.ontouchstart = function(e){
    touchPos = e.changedTouches[0].clientY;
}

// detect wether the "old" touchPos is 
// greater or smaller than the newTouchPos
document.body.ontouchmove = function(e){
    let newTouchPos = e.changedTouches[0].clientY;
    if(newTouchPos > touchPos) {
        console.log("finger moving down");
    }
    if(newTouchPos < touchPos) {
        console.log("finger moving up");
    }
}

【讨论】：

【解决方案4】：

此 w3schools.com 文档将帮助您解决问题 http://www.w3schools.com/jquerymobile/jquerymobile_events_scroll.asp

$(document).on("scrollstop",function(){
  alert("Stopped scrolling!");
});

【讨论】：