javascript - 如何从棘轮破坏/禁用 slider ？

Question

我使用ratchet.js 来滑动许多图像。

但现在我想单击元素“a”/“button”触发“slider”方法。当我们向左拖动/触摸页面时，我想销毁浏览器方法。它将转到下一个选项卡。

只允许人们通过点击按钮来跳跃。

html代码如下:

<div class="slider" id="slider">
    <div class="slide-group">
        <div class="slide">
            <img width="100%" src="/mobile/images/guide/1.jpg">
        </div>
        <div class="slide" id="slide-2">
            <img width="100%" src="/mobile/images/guide/2.jpg">
        </div>
        <div class="slide" id="slide-3">
            <img width="100%" src="/mobile/images/guide/3.jpg">
        </div>
        <div class="slide" id="slide-4">
            <img width="100%" src="/mobile/images/guide/4.jpg">
        </div>
    </div>
</div>

我尝试使用这样的代码来解决这个问题。

document.body.addEventListener('slide', function (e) {
    e.preventDefault();
    return false;
});

但它不起作用......

如何解决这个问题~~

Answer 1

这里是 slider 源代码: https://github.com/twbs/ratchet/blob/master/js/sliders.js

看起来代码直接与触摸事件(touchstart/move/end)相关，并且不提供手动控制幻灯片的功能。

这意味着使用 Ratchet 的内置 slider 很难实现您想要的效果，因此最好为 slider 使用其他东西。