Issue with AOS.js fade in animation when navigating between sections with a navbar

Question

I'm encountering a problem with the AOS.js library when using a navbar to navigate between sections on my webpage. Specifically, when I navigate from section_1 to another section below it, the fade-in animation works. However, when I navigate from a section below, such as section_2, to section_1, the animation doesn't work as expected.

Additional Context:

I've included the AOS.js library for scroll animations on my webpage. The fade-in animation works fine when scrolling down, but when using a navbar to navigate back to a section above, the animation doesn't behave as expected. I'm seeking guidance on any specific configuration or adjustment needed to ensure that the AOS.js fade-in animation works consistently when navigating both up and down through sections using a navbar.`

Code Snippet:

<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
    AOS.init({
     offset: 120, 
  delay: 0,
  duration: 1000,
    });
AOS.refresh();
</script>