Question

我正在使用AnythingSlider，http://proloser.github.com/AnythingSlider/，并创建了一个包含2个滑块的页面。

是否可以使用其中一个的上一个/下一个箭头控制这两个滑块？即你点击slider1的'prev'箭头，slider2也会移动到上一张幻灯片。

我使用onSlideBegin回调中的函数，并将targetPage传递给另一个滑块（$ slider）：

$imgSlider = $('#imgSlider').anythingSlider({
    onSlideBegin: function(e, slider) {
        $slider.anythingSlider(slider.targetPage);
    }
});

问题是从第一张幻灯片移动到最后一张（或从最后一张到第一张）。箭头所属的滑块按照需要运行（滑块是无限的，因此从第一个到最后一个使用克隆的幻灯片）。但是另一个滑块在所有幻灯片中都会回放。

有没有办法阻止这种情况？

Answer 1

当您告诉AnythingSlider转到特定页面时，它将直接转到那里而不是滑过克隆的幻灯片。 This demo来自home wiki页面，其中有一组箭头控制两个滑块。

$('#slider1, #slider2').anythingSlider({

    // If true, builds the forwards and backwards buttons
    buildArrows: false

});

$('#fwd, #bck').click(function(){
    var direction = (this.id === 'fwd') ? 'goForward' : 'goBack';
    $('ul[id^=slider]').each(function(){
        $(this).data('AnythingSlider')[direction]();
    });
});

使用一个导航控制多个Anything Sliders

1 个答案: