Aos: Uncaught ReferenceError: AOS is not defined
I am trying to add AOS library but its showing me error Uncaught ReferenceError: AOS is not defined and aos-animate class doesn't apply.
I have also included file CSS and JS .
<h1 data-aos="fade-up" data-aos-easing="delay-slide" data-aos-duration="1500" data-aos-delay="100" data-aos-offset="0">ABC</h1>
<script>
AOS.init({
easing: 'ease-out-back',
duration: 1000
});
</script>
I even tried
$(function() {
AOS.init();
});
window.addEventListener('load', AOS.refresh);
theromie
All 11 comments
if you got this error that mean you have a problem with js included file go to the console browser and check if something wrong!!
creatitif
on 7 Nov 2017
did you import AOS from 'aos';?
jinsoocha
on 22 Nov 2017
@jinsoocha
Uncaught SyntaxError: Invalid or unexpected token in aos.js:2
Uncaught ReferenceError: AOS is not defined is showing,
Btw its working fine for me on my local machine but not working on dev server and getting the above error
padhyakash
on 27 Feb 2018
Hi, I believe this is not problem with AOS itself, but rather the way you import it. Make sure that you load it correctly and that AOS is loaded before you try to initialize it.
If this problems still occurs for you, please reopen this issue and provide more informations of how you exactly load AOS and where do you initialize it.
michalsnik
on 17 May 2018
Hello, this is a wonderful library; however I am experiencing the same issue that was listed above. My code is even simpler.
HTML looks like:
<div data-aos="fade-left" id="aboutmeparani">
<h1>Hello world!</h1>
</div>
JS looks like:
AOS.init({
duration: 1200,
})
Getting the exact same error of AOS is not defined. Any help would be greatly appreciated!
stevenrichardshirley
on 8 Jun 2018
Also, I only used the CDNs and linked both in my head tag. No idea why this library won't work.
stevenrichardshirley
on 8 Jun 2018
Greetings from Venezuela
i have this issue too, working in developing a wordpress theme. I fix this issue only changing the priority on load of scripts by example.
before (this order gives to me Uncaught ReferenceError: AOS is not defined )
`
`
AOS library works in my portfolio site https://chirinosdavid1.000webhostapp.com
Davidjc90
on 6 Jul 2018
I had the same issue so i insert the <script src="https://unpkg.com/aos@next/dist/aos.js"></script> right after the <meta> tags and the problem was solved.
code :
<!DOCTYPE html>
<html lang="en">
<head>
<title>JR</title>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="shortcut icon" type="image/png" href="imgs/logo.png"/>
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
rohanparab
on 2 Mar 2019
I had the same error. I solved it by changing the order of the scripts tag. First I included the aos.js file and then I initialized it. Though I am not getting any error now, I am still not able to see any animation.
<script src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.js"></script>
<script>
AOS.init({
duration: 2000,
});
</script>
Arpan2798
on 24 Mar 2019
thanks you
Vào Th 2, 25 thg 3, 2019 vào lúc 02:10 Arpan2798 notifications@github.com
đã viết:
I had the same error. I solved it by changing the order of the scripts
tag. First I included the aos.js file and then I initialized it. Though I
am not getting any error now, I am still not able to see any animation.—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/michalsnik/aos/issues/238#issuecomment-475989932, or mute
the thread
https://github.com/notifications/unsubscribe-auth/At0zGB7WiXEImSvwq_vySOCJ57yDwEEbks5vZ82zgaJpZM4QEK0n
.
phamcuong0501
on 26 Mar 2019
Use This Css And Js or download From Official Website (both are same)
https://res.cloudinary.com/jhini-chadariya/raw/upload/v1579093192/jscss/aos_kkkheg.css
https://res.cloudinary.com/jhini-chadariya/raw/upload/v1579093193/jscss/aos_y7nuwu.js
Pankajbatham27
on 15 Jan 2020
Related issues
Crazy-Ivancz
·
5Comments
VeronikaMilic
·
4Comments
luminawastaken
·
3Comments
Panoplos
·
3Comments
jodriscoll
·
4Comments
Most helpful comment
Greetings from Venezuela
i have this issue too, working in developing a wordpress theme. I fix this issue only changing the priority on load of scripts by example.
before (this order gives to me Uncaught ReferenceError: AOS is not defined )
` after (this works for me may be can be useful) ``
`
AOS library works in my portfolio site https://chirinosdavid1.000webhostapp.com