ScrollTrigger start position question
I wanted to know if there was a simpler way of adjusting the 'start' position of a scrolltrigger, instead of using ScrollTrigger.mediaMatch and duplicating all the code to only change 1 line. Example:
gsap.to(".first", {
duration: 1,
autoAplha: 1,
yPercent: 0,
scrollTrigger: {
trigger: container,
start: "top 60%",
end: "bottom bottom",
toggleActions: "play none none reverse"
}
});
So if I wanted to just change "top 60%" to "top 80%" for max-width: 768px. Instead
If I were you, I'd just use a function and then parameterize whatever you want:
ScrollTrigger.matchMedia({
// desktop
"(min-width: 769px)": build("top 60%"),
// mobile & tablet
"(max-width: 768px)": build("top 80%")
});
function build(start) {
return function() {
gsap.from(".first", {
duration: 1,
autoAplha: 1,
yPercent: 0,
scrollTrigger: {
trigger: container,
start: start,
end: "bottom bottom",
toggleA
