Jquery工具触摸水平仅禁用垂直触摸

我有jquery工具滚动…我喜欢它只为swipeLeft swipeRight实现触摸选项。

当我使用touch：true时，它也会在swipeUp / Down时旋转。

我按照说明在这里：

jQuery工具可滚动触摸禁用垂直滚动

和这里：

http://awardwinningfjords.com/2010/09/22/handling-touch-events-in-jquery-tools-scrollable.html

但似乎没有工作..任何想法？ 我的小提琴/演示在下面供参考

小提琴： http ： //jsfiddle.net/mmp2m/7/

演示： http ： //jsfiddle.net/mmp2m/7/show

谢谢

Answer 1

如果您使用的唯一控件是Scrollable，那么您可以从此处编辑它的源代码以修复该行为或根据您的需要调整它。

我修改了你发布的小提琴 ，在JavaScript代码部分包含了Scrollable控件的代码。

在控件的代码中添加的行是在以下代码段的末尾// added注释// added ：

  // touch event if (conf.touch) { var touch = {}; itemWrap[0].ontouchstart = function(e) { var t = e.touches[0]; touch.x = t.clientX; touch.y = t.clientY; }; itemWrap[0].ontouchmove = function(e) { // only deal with one finger if (e.touches.length == 1 && !itemWrap.is(":animated")) { var t = e.touches[0], deltaX = touch.x - t.clientX, deltaY = touch.y - t.clientY, absX = Math.abs(deltaX), // added absY = Math.abs(deltaY); // added // Only consider the event when the delta in the // desired axis is greater than the one in the other. if(vertical && absY > absX || !vertical && absX > absY) // added self[vertical && deltaY > 0 || !vertical && deltaX > 0 ? 'next' : 'prev'](); e.preventDefault(); } }; } 

我已经在Android中尝试使用本机和Opera浏览器，并且似乎按预期工作。

Answer 2

我一直在努力解决同样的问题，直到我发现以下修复 –

初始化-

 var $scroller1 = $('#outer-container1').kinetic({'y':false}); 

这可以防止容器上的垂直滚动，但不会将垂直滚动传递给浏览器滚动条。

然后转到jquery动能源代码并注释掉所有鼠标和滚动动作事件的e.preventDefault() 。

这个黑客对我有用。 https://github.com/davetayls/jquery.kinetic/issues/33