If you want to delay fullPage.js animation so the scrolling can take place once an animation is finished, for example, you can use the `beforeLeave` callback.

If you return a `false` value on this callback, the scroll won't take place.

You can use this feature to add your own logic within this callback and control when the scroll will get triggered.

Here's a quick example that will require you 4 scrolls before allowing you to scroll to the next section:

var cont = 0;
new fullpage('#fullpage', {
    beforeLeave: function(origin, destination, direction, trigger){

        // prevents scroll until we scroll 4 times
        cont++;
        return cont === 4;
    }
});

 

So, how can you apply it so you can scroll after the animation takes place?

Here's a demo:

See the Pen fullPage.js delay scroll until animation finishes GSAP by Álvaro (@alvarotrigo) on CodePen.

 

You might also find these articles relevant:

• Use fullPage responsive mode and keep snap scroll effect
• Make an element scrollable inside a fullpage.js section or slide
• Make a section scrollable in fullpage.js using scrollOverflow
• Why my scroll based animations or events don't work?
• I can't scroll to the footer of my WordPress site