Ali961 Posted July 28, 2022 Share Posted July 28, 2022 hi guys , it is the first time that I use Gsap . It doesnt work and inside console i can see that gsap is not defined , I already added both the links inside script tags and added the files in a script folder and later on it source inside script tags . Any help to solve the problem ? maybe any extensions needed to be downloaded ??? thank you Link to comment Share on other sites More sharing options...
SteveS Posted July 28, 2022 Share Posted July 28, 2022 It's going to be an issue with your environment which makes it difficult for anyone else to debug. Link to comment Share on other sites More sharing options...
Cassie Posted July 28, 2022 Share Posted July 28, 2022 Can you share any more info @Ali961 - maybe a screenshot of your setup? Are you sure the script tags are correct? Link to comment Share on other sites More sharing options...
Ali961 Posted July 28, 2022 Author Share Posted July 28, 2022 @Cassie sure i am using VS code but i cant upload its screenshot because it is more than 500 kb . i send you the js code in another comment . thnx u Link to comment Share on other sites More sharing options...
GreenSock Posted July 28, 2022 Share Posted July 28, 2022 Why are you loading a bunch of files twice? You definitely shouldn't be doing that. It looks like you're loading things from a CDN and ALSO locally from a /scripts/ folder. Link to comment Share on other sites More sharing options...
Ali961 Posted July 28, 2022 Author Share Posted July 28, 2022 @GreenSock first i have tried using "<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.10.4/gsap.min.js"></script>''' but it didnt work so i tried using the extra plugins on CDN but it didnt work later i added the whole files and didnt work . do that cause an extra problem ? Link to comment Share on other sites More sharing options...
Ali961 Posted July 28, 2022 Author Share Posted July 28, 2022 @Cassie here is the js code , i am trying a very simple example , it always says that gsap is nt defined . Link to comment Share on other sites More sharing options...
GreenSock Posted July 28, 2022 Share Posted July 28, 2022 It's virtually impossible to troubleshoot blind - we really need to see the issue in context but my best guess is that you put your code in the document BEFORE the <script> tag that loads GSAP. So you're trying to use GSAP before it even loaded. Make sure the <script> tag that loads GSAP is BEFORE your custom code that's trying to animate things. Link to comment Share on other sites More sharing options...
Ali961 Posted July 28, 2022 Author Share Posted July 28, 2022 yes it works if i put the js code inside a script tag at the end of the body in the html page and after the script tag that loads GSAP . but i prefer to use a separate file for the whole js code , so i dnt write some of my js code inside the html page and the rest in a file of type js . Link to comment Share on other sites More sharing options...
GreenSock Posted July 28, 2022 Share Posted July 28, 2022 3 minutes ago, Ali961 said: yes it works if i put the js code inside a script tag at the end of the body in the html page and after the script tag that loads GSAP . but i prefer to use a separate file for the whole js code , so i dnt write some of my js code inside the html page and the rest in a file of type js . That's fine. You can do that: <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.10.4/gsap.min.js"></script> <script src="/scripts/java.js"></script> (obviously load whatever files you need - I just showed the core one here) Or you can leave your code exactly the way it is and just put it into a function that's called when the document is finished loading (so that GSAP exists at that time). It's up to you. 1 Link to comment Share on other sites More sharing options...
Ali961 Posted July 28, 2022 Author Share Posted July 28, 2022 sure i prefer load it from a js file but it doesnt work even if i put the script tag of GSAP before that of the js files . Link to comment Share on other sites More sharing options...
iDad5 Posted July 30, 2022 Share Posted July 30, 2022 If you load your own JS-file after gsap it is really strange that, gasp isn'n defined in that script. Have you made sure in your browsers dev-tools that the files are actually loaded? (no 404 in console?) I generally like to initialize almost everything only after the DOM is loaded like this: document.addEventListener('DOMContentLoaded', init); function init() { //do this fo that in other functions } maybe that helps? Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now