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

Get current slide on fullpage.js

本文关键字:幻灯片 获取 fullpage js      更新时间:2023-09-26

我是一个快乐的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/

三种方式

  • 使用回调,如onSlideLeave .
  • 使用fullPage.js添加的状态类之一
  • 就像$('.fp-section.active').find('.fp-slide.active');

我相信这段代码可以解决我的问题,我只需要改变警报也许?

$('#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! ");
        }
    }
});