Aos: Followed Install Instruction but Still Not Working

[s3w47m88]

Forgive me if this isn't the appropriate place for this question.

I'm new to AOS, I cloned the files into my project folder. Then I included the call to the CSS and JS. And I placed the init script snippet in the header (I tried both before and after) and then placed the sample div tag into the body and refreshed my page expecting to see it appear with effects. Instead I just get a blank space.

<div data-aos="fade-zoom-in" data-aos-offset="200" data-aos-easing="ease-in-sine" data-aos-duration="600"><h1>test</h1></div>

What am I missing?

Thank you!

[shihabiiuc]

Here is the same

[michalsnik]

Try to init aos on document ready:

$(function() {
  AOS.init();
});

[Banhawy]

Make sure that you link the document that inits AOS
$(function() { AOS.init(); });
before you link the aos javascript document

[spennydix]

@Banhawy Before?

I have AOS.init() running (on document ready) after the link to the AOS.js doc and it's half-working... Objects only animate in on window resize.

[padhyakash]

@Banhawy

Uncaught ReferenceError: AOS is not defined
getting the above error, but it's working fine on my local machine but getting the above error in Dev server

[michalsnik]

If you still experience some issues with proper initialisation, you might try also refreshing it on window load:

window.addEventListener('load', AOS.refresh);

or straight:

AOS.init({
  startEvent: 'load'
});