而不阻塞浏览器的触摸javascript支持掐支持(Javascript support for t

我有我加刷卡导航，为移动浏览器一点点网上画廊。 我用很简单touchstart / touchmove / touchend事件跟踪做到了。

问题是，当我尝试在浏览器窗口来捏变焦如有手指在我增加了触摸事件处理程序，我是从调用了preventDefault猜测元素开始失败。

有没有一种方法，我可以跟踪我的导航图像，而进出浏览器的功能，阻断变焦的触摸事件？ 我不介意堵单指滚动，如果它是在我的元素，但我想允许捏缩放。

下面的代码：

  function addDragHandlers(eventDivId) {
    var startX, endX;
    var slides = $('#'+eventDivId);

    slides.bind('touchstart', function(e) {
        e.preventDefault();
        startX = e.pageX;
        endX = startX;
    });

    slides.bind('touchmove', function(e) {
        e.preventDefault();
        endX = e.pageX;
    });

    slides.bind('touchend', function(e) {
            e.preventDefault();
            if ( endX - startX < 0) {
                // go to next image
            } else if ( endX - startX > 0) {
                // go to previous image
            } else {
                // do click action
            }
        }
    });
 }

Answer 1:

你想要的是ongesturestart，ongesturestart移动和结束时的相同的联系，但超过一个手指。 从他们可以添加一个侦听器：

event.stopPropagation();

防止“的preventDefault（）”从传播。

Answer 2:

我想这在Android上工作，所以我不想用手势事件，我已经阅读只在iOS上 - 虽然我没有Android的验证这种说法。

然后我看着一帮其试图使手势支持浅显易懂的JavaScript手势库。 遗憾的是他们没有工作的很好，我的目的。

所以，我结束了使用对身体的触摸处理程序要跟踪的网页，然后自定义启发式的所有接触，以确定是否使用触摸导航画廊或用它来滚动/捏页面。

这还不够完善。 如果你触摸我的画廊元素，然后接触外面捏不工作启动。

顺便说一句，在“TouchSwipe” jQuery库有一个令人难以置信的精心设计和灵活的API，但我需要的，我的元素只跟踪水平刷卡的配置，iOS6的下过于离奇和几个一直没有更新周。 如果您正在寻找到这种挑战，这是一个几个月从现在起我建议你检查了该插件的更新。

文章来源: Javascript support for touch without blocking browsers pinch support