Question

我在我正在制作的模板上使用Unslider。我正在使用j.Query.event.swipe在移动设备上提供触摸/滑动支持。

问题是在移动设备上，滑块没有垂直触摸响应 - 除非您触摸滑块元素外，否则无法上下滚动。左/右滑动工作正常，您可以滑动幻灯片，除非您在滑块外部触摸，否则无法用手指向上和向下滚动页面。

我觉得这是jQuery的一个问题，但我无法弄清楚它是什么。这是我在底部的index.html上的代码：

<!-- Reference jQuery -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

    <!-- Reference Javascript, minify for production -->
    <script type="text/javascript" src="js/jquery.event.move.js"></script>
    <script type="text/javascript" src="js/jquery.event.swipe.js"></script>
    <script type="text/javascript" src="js/unslider.js"></script>

    <!-- Unslider script -->
    <script>
        $(document).ready(function () {
            var unslider = $('.slider').unslider();
            $('.unslider-arrow').click(function(event) {
                event.preventDefault();
                if ($(this).hasClass('next')) {
                    unslider.data('unslider')['next']();  
                } else {
                    unslider.data('unslider')['prev']();  
                };
            });
    });
    </script>

Answer 1

我找到了自己的答案：https://github.com/idiot/unslider/pull/76

var unslider = $('.banner').unslider();
unslider.on('movestart', function(e) {
if((e.distX > e.distY && e.distX < -e.distY) || (e.distX < e.distY && e.distX > -e.distY)) {
    e.preventDefault();
}
});

在Unslider上垂直滚动

1 个答案: