Default wipe for some wipes using jQuery touchwipe

2019-04-09 10:10发布

I'm using this wonderful plugin to capture wipe events on mobile devices: http://www.netcu.de/jquery-touchwipe-iphone-ipad-library

I'm using the code in the source of that page to get my image gallery cycling as it should be. However, my image gallery is the full width of the screen. Unfortunately, touchwipe seems to be preventing the default up and down wipes from scrolling up and down the page. Is there a way to make it use the default behaviour, except when other behaviour is specified?

$(document).ready(function() {
    $('#imagegallery').cycle({
        timeout: 0,
        fx: 'scrollHorz',
        next: '#next',
        prev: '#prev' 
    });

    $("#imagegallery").touchwipe({
        wipeLeft: function() {
            $("#imagegallery").cycle("next");
        },
        wipeRight: function() {
            $("#imagegallery").cycle("prev");
        }
    });
});

I'm also open to other alternatives to achieving this same effect (other plugins, other methods). Thanks!

2条回答
兄弟一词,经得起流年.
2楼-- · 2019-04-09 10:38

With this small patch to the jquery.touchwipe library:

if(Math.abs(dx) >= config.min_move_x) {
     cancelTouch();
     if(dx > 0) {
-        config.wipeLeft();
+        config.wipeLeft(e);
     }
     else {
-        config.wipeRight();
+        config.wipeRight(e);
     }
  }
  else if(Math.abs(dy) >= config.min_move_y) {
     cancelTouch();
     if(dy > 0) {
-        config.wipeDown();
+        config.wipeDown(e);
     }
     else {
-        config.wipeUp();
+        config.wipeUp(e);
     }
  }

you can then change your code to selectively call e.preventDefault():

$(document).ready(function() {
    $('#imagegallery').cycle({
        timeout: 0,
        fx: 'scrollHorz',
        next: '#next',
        prev: '#prev' 
    });

    $("#imagegallery").touchwipe({
        wipeLeft: function(e) {
            e.preventDefault();
            $("#imagegallery").cycle("next");
        },
        wipeRight: function(e) {
            e.preventDefault();
            $("#imagegallery").cycle("prev");
        },
        preventDefaultEvents: false
    });
});

(I've submitted the patch to the plugin author.)

查看更多
爱情/是我丢掉的垃圾
3楼-- · 2019-04-09 10:51

I've found a temporary answer that partially works, found here: http://plugins.jquery.com/content/vertical-scroll

It would be good to get a better answer though.

查看更多
登录 后发表回答