Prevent from adding active class to section on fullpage.js

Question

When loading first section of fullpage.js page, it adds active class to the section. The problem is that class triggers animation behind the scene, so the user will see finished animation. How to prevent fullpage.js from adding active class to the section?

Answer 1

You can use the fullpage.js event callback functions for this,

    onLeave: function(index, nextIndex, direction){},
    afterLoad: function(anchorLink, index){},
    afterRender: function(){},
    afterResize: function(){},
    afterResponsive: function(isResponsive){},
    afterSlideLoad: function(anchorLink, index, slideAnchor, slideIndex){},
    onSlideLeave: function(anchorLink, index, slideIndex, direction, nextSlideIndex){}

see this documentation https://github.com/alvarotrigo/fullPage.js/

when leaving the first slide add the callback function to the onLeave: to remove the active class from that element, like

$('.class').fullpage({
onLeave: function(index, nextIndex, direction){
// remove the active class here
}
});