使用fullpage.js - 是否可以按顺序加载每张幻灯片上的元素？

Question

我正在使用fullpage.js创建一个http://www.apple.com/uk/iphone-5s/之类的效果.

它工作正常但是我需要在幻灯片上依次淡化一堆单独的元素,但只有在选择/激活相应的元素幻灯片时才会这样.

我认为最好的方法是在选择视口上将元素设置为onLoad,除非我尝试这样做,我似乎遇到了与fullpage-js的jQuery冲突问题,反之亦然.

有谁能推荐一个解决方案？

谢谢

Answer 1

如果您正在尝试它,那么一旦用户到达它就为每张幻灯片执行一些代码,那么您可以使用afterLoad或onLeave事件来执行此操作.

这里有一个有用的例子:http: //alvarotrigo.com/fullPage/examples/callbacks.html

您的初始化应类似于:

$.fn.fullpage({
    'afterLoad': function (anchorLink, index) {
        //for section 2...
        if (index == 2) {
            //whatever
        }
    },

    'onLeave': function (index, nextIndex, direction) {
        //going from section 3 to 4
        if (index == 3 && direction == 'down') {
           //whatever
        }

        //going form section 3 to 2
        else if (index == 3 && direction == 'up') {
           //whatever
        }
    }
});

如果你想要的是在幻灯片上而不是在部分上做某事,那么你应该使用偶数afterSlideLoad.