使用jQuery touchwipe默认擦除一些擦除

前端之家收集整理的这篇文章主要介绍了使用jQuery touchwipe默认擦除一些擦除前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在使用这个精彩的插件来捕获移动设备上的擦除事件:http://www.netcu.de/jquery-touchwipe-iphone-ipad-library

我正在使用该页面代码中的代码来使我的图像库循环应用.但是,我的图库是屏幕的整个宽度.不幸的是,touchwipe似乎阻止了默认的上下擦除在页面上下滚动.有没有办法让它使用默认行为,除非指定了其他行为?

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

我也对实现同样效果的其他替代方案持开放态度(其他插件,其他方法).谢谢!

最佳答案
使用jquery.touchwipe库的这个小补丁:

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);
     }
  }

然后,您可以更改代码以有选择地调用e.preventDefault():

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

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

(我已将补丁提交给插件作者.)

猜你在找的jQuery相关文章