检测触摸向上或向下滚动

时间:2016-04-13 11:10:25

标签: javascript jquery scroll touch

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

$(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');
        }
    }
});

4 个答案:

答案 0 :(得分:4)

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

答案 1 :(得分:3)

您可以使用滚动事件

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

答案 2 :(得分:0)

此w3schools.com文档可以帮助您http://www.w3schools.com/jquerymobile/jquerymobile_events_scroll.asp

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

答案 3 :(得分:0)

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

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(e.changedTouches[0]clientY < touchPos) {
        console.log("finger moving up");
    }
}