获取fullpage.js上的当前幻灯片

Question

我是一个快乐的Fullpage.js用户！
我只想添加一个类(.num)，来显示幻灯片的当前页码/总页数。

我正在使用这个函数，它可以正常工作，但问题是在切换幻灯片时不会更新。

$('.section').each(function(){
    var section = $(this),
    sectionSlides = section.find('.slide'),
    totalItems = sectionSlides.length,
    currentIndex = sectionSlides.filter('.active').index() + 2,
    numContainer = section.find('.num');

numContainer.html(currentIndex + ' / ' + totalItems);
});

http://jsfiddle.net/168xofn3/11/

- Federico

---

你如何检查当前幻灯片是否已更改？ - Nikolay Ermakov

额，我不知道，我以为那个“active”状态就足够了。 - Federico

我认为你需要识别一个事件，当活动幻灯片更改时会触发。这是在你点击某个按钮（如下一张或返回）时吗？之后，您需要将一些代码放入该事件处理程序中，以便在新的活动幻灯片变得明显时执行。 - Nikolay Ermakov

我可以点击箭头向右/向左来到下一个/上一个幻灯片，但我也可以使用键盘上的箭头。我能请你给个提示如何触发这个事件吗？ - Federico

当然可以，但您能否同时发布包含这些按钮功能的HTML和JavaScript呢？ - Nikolay Ermakov

为什么不在jsfiddle上发布一个包含fullPage.js的示例呢？这样我们就可以更清楚地了解您想要实现什么。但无论如何，您需要利用fullPage.js回调函数，例如onLeave或onSlideLeave。 - Alvaro

Answer 1

三种方法：

• 使用回调函数，例如onSlideLeave。
• 使用fullPage.js添加的状态类之一。
• 只需执行像$('.fp-section.active').find('.fp-slide.active');这样的操作。

- Alvaro

---

谢谢你的提示。关于onSlideLeave的问题是我无法设置某人离开的方向。它可以是左或右，所以在currentIndex中+1或-1。 - Federico

检查回调中的参数 direction。 - Alvaro

Answer 2

我相信这段代码可以解决我的问题，我只需要改变那个警告提示吗？

$('#fullpage').fullpage({
    onSlideLeave: function( anchorLink, index, slideIndex, direction, nextSlideIndex){
        var leavingSlide = $(this);

        //leaving the first slide of the 2nd Section to the right
        if(index == 2 && slideIndex == 0 && direction == 'right'){
            alert("Leaving the fist slide!!");
        }

        //leaving the 3rd slide of the 2nd Section to the left
        if(index == 2 && slideIndex == 2 && direction == 'left'){
            alert("Going to slide 2! ");
        }
    }
});

- Federico