Getting error on load - GSAP is not defined

[servus]

Hello,

i am very new to GSAP and i am getting in some troubles, which i could not solve after hours and hours trying to find a solution.

 

I think everything is loading correctly but i get this error: gsap is not defined. First i load all GSAP libraries and last my custom.js. Please can somebody take a look?

 

Thanks a lot for helping.

 

Drupal.behaviors.revealImages = {
    attach: function(context, settings) {

        gsap.registerPlugin(ScrollTrigger);

        let revealContainers = document.querySelectorAll(".reveal");

        revealContainers.forEach((container) => {
            let image = container.querySelector("img");
            let tl = gsap.timeline({
                scrollTrigger: {
                    trigger: container,
                    toggleActions: "restart none none reset"
                }
            });

            tl.set(container, {
                autoAlpha: 1
            });
            tl.from(container, 1.5, {
                xPercent: -100,
                ease: Power2.out
            });
            tl.from(image, 1.5, {
                xPercent: 100,
                scale: 1.3,
                delay: -1.5,
                ease: Power2.out
            });
        });

    }
};

 

[GreenSock]

Welcome to the forums, @servus.

 

Looks to me like it's because you're loading GSAP after another file that's trying to use GSAP. Notice the error mentions drupal.js, and in your list of <script> tags that one is ABOVE the GSAP one. 

 

Basically just make sure GSAP is loaded before you try to use GSAP

 

Hopefully it's just a matter of putting the GSAP files first in your list.