[Decreasing long list font size on scroll]

Hi I have a question about number 3, I saw this post who says that you should always declare the scrolltrigger in the timeline:

https://github.com/greensock/GSAP/issues/471

 

I am confused, which is the best approach? Thank you. Is setting it within the defaults different than outside of defaults?

 

[Is it possible to pass class variables from javascript into scrolltrigger matchMedia function?]

Woops sorry, arrow functions do work, I just forgot to resize my window lol. 

[Is it possible to pass class variables from javascript into scrolltrigger matchMedia function?]

I'm using GSAP to animate things that aren't DOM elements. Specifically a cube in THREE.js. I apologize - I'm not proficient enough to make a minimal demo, but I just want to know if it's possible to pass a class variable from javascript into the ScrollTrigger matchMedia:

 

ScrollTrigger.matchMedia({
            "(max-width: 1024px)": () => {
                this.moveTimeline = new GSAP.timeline({
                    scrollTrigger: {
                        trigger: ".area-one",
                        start: "top top",
                        end: "bottom bottom",
                        scrub: true,
                    },
                });
                this.moveTimeline.to(this.cube.position, {
                    x: 5
                });
            },
        });

 

In this example I have a constructor as such with the variable this.cube:

class Cube{
  constructor(){
	this.cube = three.js cube
  }
}

Of course, if I use function(){} I get errors saying "this.cube" is not defined, because I lose the context. But if I use an arrow function I get no errors,  but the matchMedia no longer works. Basically nothing moves.

 

Is it possible to access class variables in ScrollTrigger's MatchMedia?