Question

我想以“current_slide / total_slides”的格式构建一个jQuery Cycle幻灯片，其格式为“here

我假设我使用pageAnchorBuilder显示当前和总幻灯片数，然后onAfter更新当前幻灯片号？

任何人都可以帮忙吗？谢谢！

Answer 1

我建议使用jQuery Cycle插件。想象一下，幻灯片是一个有序的列表：

<ol class="slides">
    <li class="slide">...</li>
    ...
</ol>
<a id="prev"></a><span id="counter">1 / 1</span><a id="next"></a>

您可以致电：

获取幻灯片总数

var total = $('.slides').children().length;

然后我们需要在幻灯片更改后更新计数器：

$('.slides').cycle({
    after(el) {
        const currentSlideNo = $(el).index();
        $('#counter').text(currentSlideNo + ' / ' + total);
    },
    prev: $('#prev'),
    next: $('#next'),
});

Answer 2

无需计算总数和slideindex，因为jquery循环插件已经在after事件中返回给你们。

 after: function(currSlideElement, nextSlideElement, options, forwardFlag) {

    $('#counter').text((options.currSlide + 1) + '/' + (options.slideCount));
 }

这是一个jsfidde：http://jsfiddle.net/lucuma/Dhqdc/2/

jQuery循环分页与当前/总幻灯片

2 个答案: