0

我正在使用Unslider,并且我在一个页面上有多个滑块 - 所有滑块都具有相同的my-slider. 如果通过点导航,滑块可以工作 - 但下一个和上一个按钮不起作用。

我的 JS 是:

jQuery(document).ready(function($) {
    var slider = $('.my-slider').unslider({
        arrows: false
    });
    slider.on('click', function() {
        slider.unslider('next');
    });
});

HTML:

<div class="my-slider">
    <ul>
        <li><img class="img-pad" src="img/cannes-bridge.jpg" alt=""></li>
        <li><img class="img-pad" src="img/cannes-jean.jpg" alt=""></li>
        <li><img class="img-pad" src="img/cannes-nis-1.jpg" alt=""></li>
        <li><img class="img-pad" src="img/cannes-sam.jpg" alt=""></li>
        <li><img class="img-pad" src="img/cannes-igor.jpg" alt=""></li>
    </ul>
</div>

这里有一个实时版本,您可以在其中看到它在第一个滑块上按预期工作 - 但是当您单击幻灯片移动到下一个滑块时,它会在第二个滑块上中断。

编辑:

我在这里发现了一个类似的问题,但我是 JS 新手,似乎无法理解适用于我的解决方案。

4

0 回答 0