title: fullpagejs and AOS - not working together
body: <p>I'm using <a href="https://github.com/alvarotrigo/fullPage.js/" rel="nofollow noreferrer">fullpagejs</a> and <a href="https://github.com/michalsnik/aos" rel="nofollow noreferrer">AOS</a> to make some divs popping up from the bottom of the page on scroll (or at least that's what I'd like to achieve).</p>
  <p>Unfortunately, it is not working.</p>
  <p>Yes, I've read the <a href="https://github.com/alvarotrigo/fullPage.js/wiki/FAQ---Frequently-Answered-Questions" rel="nofollow noreferrer">FAQ</a> sections of fullpage and yes, <code>scrollbar</code> is set to <code>true</code> and <code>autoscroll</code> is set to <code>false</code>.</p>
  <p>My setup is the following:</p>
  <pre><code>&lt;div class=&quot;section&quot; id=&quot;test&quot;&gt;
     &lt;div class=&quot;slide&quot;&gt;
        &lt;div class=&quot;section&quot;&gt;
        {someOtherContent}
        &lt;!-- div i want to animate is down below --&gt;
        &lt;div data-aos=&quot;slide-up&quot;&gt;test&lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class=&quot;slide&quot;&gt;&lt;/div&gt;
  &lt;div class=&quot;slide&quot;&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  
  $('#test').fullpage({
    
    lazyLoading: false,
    lockAnchors: true,
    
    scrollingSpeed: 300,
    fitToSection: false,
    easing: 'easeInOutCubic',
    easingcss3: 'ease',
    loopHorizontal: false,
    offsetSections: false,
    resetSliders: false,
    scrollOverflow: true,
    scrollOverflowReset: true,
    touchSensitivity: 0,
    bigSectionsDestination: top,
  
    
    keyboardScrolling: false,
    animateAnchor: false,
    recordHistory: true,
  
    
    controlArrows: false,
    verticalCentered: true,
    responsiveWidth: 0,
    responsiveHeight: 0,
  
    
    sectionSelector: '.section',
    slideSelector: '.slide',
    scrollBar:true
  
    //events
    afterLoad: function (anchor, index( {
      initArrowEventListener()
  }
  </code></pre>
  <p>the afterLoad event function simply initialises my menu links (based on the slide index) and the only relevant part is that I initialise <code>AOS</code> when I click on one specific link (as I want the library to work only on a specific page and not everywhere.</p>
  <p>So, I load the page, click to navigate on the slider page I want, the function is called (console log proofs it, as well as AOS classes are applied to the relevant div), I can see the scrollbar, but nothing, the div is not popping up from the bottom.</p>
  <p>Any idea what am I doing wrong here?</p>
  <p>There used to be <a href="https://codepen.io/nickimola/pen/WMeeJK" rel="nofollow noreferrer">this pen</a> illustrating the same problem. Click on &quot;About&quot; (the function that initialises AOS is called as the one for the title works as well), scroll to the bottom and you will see a lot of white space. If you inspect the console, AOS is initialised on the element (its classes are applied) but the element never slides up)</p>