0

我已经在网上搜索了几天，但没有找到解决我问题的方法。我正在构建一个移动网站，上面会有一些元素，可以通过在它们上滑动手指来水平滚动。到目前为止，这工作正常。

为了防止页面在滑动时垂直滚动，我将 event.preventDefault() 添加到 touchmove 事件中，这就是问题所在；我希望用户能够在垂直滑动此元素时滚动页面，但前提是他/她滑动它，比如说 60 像素（垂直）。我怎样才能做到这一点？使用我使用的代码，执行“else”（当滚动长度超过 70px 时），但不会发生滚动。我想做的甚至可能吗，在那种情况下怎么做？

这是我尝试过的一些代码：

$(Carousel_Wrapper).bind('touchstart', function(event) 
{
    // Some other stuff happens here

    // Set last y-coord
    Carousel_LastPageY = event.originalEvent.touches[0].pageY;

    // Bind the touchmove event
    $(Carousel_Wrapper).bind('touchmove', function(event) 
    {
        // The function which scrolls the content of the element
        Carousel_Drag(event.originalEvent.touches[0].pageX, event);

        // Calculate the vertical swipe length
        var Carousel_VerticalSwipeLength = event.originalEvent.touches[0].pageY - Carousel_LastPageY;

        // Convert to a positive value
        if(Carousel_VerticalSwipeLength < 0)
        {
            Carousel_VerticalSwipeLength = Carousel_VerticalSwipeLength * -1;
        }

        // If the vertical scroll-length is less than 70px
        if(Carousel_VerticalSwipeLength < 70)
        {
            event.preventDefault();
        }

        // The scroll-length was more than 70px, resume scrolling
        else
        {
            // I've tried this:
            return true;

            // Then this:
            $(Carousel_Wrapper).unbind('touchmove');

            // And at last this:
            $(Carousel_Wrapper).unbind('touchmove');
            $(Carousel_Wrapper).trigger('touchmove');
        }
    });
});

任何帮助表示赞赏！

谢谢， 亨里克

4

1 回答 1

0

您的变量应该存储触摸差异的总和。您的变量看起来只查看每个差异的数量，而不是它们的总和。

于 2012-05-11T08:32:07.933 回答