用两个手指手势实现水平滚动

Question

I am trying to implement horizontal scrolling using a two finger gesture on laptops. I am trying to find a solution that works in IE, chrome and safari. Currently I have tried to using the mouse wheel event to simply capture the scrolling Event. I thought I could use the deltaX and deltaY to determine if it is scrolling vertically and horizontally.

$('#ryan').on('mousewheel', function (event) {
    if (event.originalEvent.deltaX > 0) {
        console.log(event.originalEvent.deltaX);
        console.log("horizontally");
        console.log(event.deltaX);
}

Here is a fiddle which is not working. I am also not sure if there is another event I am missing.

Answer 1

I have never done it but jquery has a well documented element handler for scroll

I would try

$('#ryan').scroll(function(event) {
    if (event.originalEvent.deltaX > 0) {
        console.log(event.originalEvent.deltaX);
        console.log("horizontally");
        console.log(event.deltaX);
});

http://api.jquery.com/scroll/