我正在使用这个很棒的插件来捕获移动设备上的擦除事件:http://www.netcu.de/jquery-touchwipe-iphone-ipad-library 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,
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
});
});
(我已将补丁提交给插件作者。)
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)