javascript - jQuery Cycle - #next #prev，在当前图库的最后一张幻灯片之后转到下一个图库

Question

我在几个带有#next #prev 导航和图像计数器输出的画廊中使用 jQuery cycle。

现在我正在尝试将所有这些画廊连接在一起。如果用户到达图库 A (galleryA.html) 的最后一张幻灯片，#next anchor 应指向图库 B (galleryB.html)/#prev anchor 应指向图库 C (galleryC.html)。

我怎样才能结合我的 2 个功能来做到这一点？

// slideshow fx
$(function() {
        $('#slideshow').cycle({ 
        fx:     'fade',
        speed:  350,        
        prev:   '#prev', 
        next:   '#next', 
        timeout: 0,
        after:     onAfter
    });
});
//image counter output
function onAfter(curr,next,opts) {
    var caption = 
        (opts.currSlide + 1) + opts.slideCount;
        $('#counter').html(caption);
}

html:

<div id="slideshow-container">

<div class="slideshow-nav"><a id="prev" href=""></a></div>
<div class="slideshow-nav"><a id="next" href=""></a></div>

<div id="slideshow" class="pics">
    <img src="galleryA/01.jpg" />
    <img src="galleryA/02.jpg" />
    <img src="galleryA/03.jpg" />
    <img src="galleryA/04.jpg" />
    <img src="galleryA/05.jpg" />
    <img src="galleryA/06.jpg" />
</div>
</div>

Answer 1

不太熟悉 cycle 插件，但是你可以在 function onAfter 中放置这样的东西:

if(opts.currSlide == opts.slideCount) { 
  $("#next").attr("href","galleryB.html"); 
}

或者你可以试试

if(opts.currSlide == opts.slideCount) { 
 $("#next").click(function() { document.location = "galleryB.html"; });
}

未经测试，类似的东西？

基本上它只在最后一张幻灯片显示后将重定向行为附加到 #next 上。可能有一个 onFinish 选项或其他东西，你检查过文档了吗？