GSAP not triggered

[mmmmm0ffffffff]

Hello,

Not the expert one here, but I'm trying something simple.

The Codepen works, but won't work on my website - attaching also the console log.

 

Not sure really where I'm mistaking as it works on Codepen, must be something basic but not sure where/what to look for?!

 

Any leads? Would make my day!

Thanks!

 

 

See the Pen BaKJyrN by mmmmm0fffffffff (@mmmmm0fffffffff) on CodePen

[ZachSaucier]

Hey mmmmm0ffffffff and welcome to the GreenSock forums.

 

Those console messages tell us that there is no element with a class of massiveImage on your page by the time that the script runs. So either make sure to add it to your page or make sure the JS runs after that element is loaded.

 

Perhaps another issue is because you're loading the CodePen versions of the GSAP files instead of the CDN versions (like you should be using)? Try these files instead:

https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/gsap.min.js
https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/ScrollTrigger.min.js

[mmmmm0ffffffff]

22 minutes ago, ZachSaucier said:

Hey mmmmm0ffffffff and welcome to the GreenSock forums.

 

Those console messages tell us that there is no element with a class of massiveImage on your page by the time that the script runs. So either make sure to add it to your page or make sure the JS runs after that element is loaded.

 

Perhaps another issue is because you're loading the CodePen versions of the GSAP files instead of the CDN versions (like you should be using)? Try these files instead:

https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/gsap.min.js
https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/ScrollTrigger.min.js

 

Hey Zach, this was fast and correct - the JS was running too soon!

 

Thanks a lot, very very helpful, I basically finished my website now!