Question

我正在使用fullpage.js在页面过渡之间添加动画，这是不可或缺的，因为我延迟了页面之间的过渡，以便用户可以看到动画。但是，我使用的方法无效，并且控制台中没有任何信息可以帮助我产生所需的效果。

$('#fullpage').fullpage({
  navigation: true,
  anchors: ['code', 'eng']
});
var delay = 2000;
var timeoutId;
var animationIsFinished = false;

new fullpage('#fullpage', {
  onLeave: function(origin, destination, direction) {
    var curTime = new Date().getTime();
    $('.footage').addClass('footage2');
    clearTimeout(timeoutId);
    timeoutId = setTimeout(function() {
      animationIsFinished = true;

      fullpage_api.moveTo(destination.index + 1);
    }, delay);
    return animationIsFinished;
  },
});

我想延迟页面转换，以便在下一页加载之前向元素添加类。

Answer 1

我需要结合两个功能

var delay = 2000; //milliseconds
var timeoutId;
var animationIsFinished = false;
new fullpage('#fullpage', {
    sectionsFootage: ['url(./img/pmoney.gif)', 'url(./img/neonLogo.jpg)'],

    onLeave: function(origin, destination, direction){
        var curTime = new Date().getTime();

        //animating my element
        $('#element').addClass('animate');

        clearTimeout(timeoutId);

        timeoutId = setTimeout(function(){
            animationIsFinished = true;

            fullpage_api.moveTo(destination.index + 1);
        }, delay);

        return animationIsFinished;
    },
});

延迟加载下一页fullpage.js不起作用

1 个答案: