[ScrollTrigguer's End position jumps when scrolling, making the image jumps too. Maybe a scrolltrigger issue ou cache issue]

 

When I scroll, the image makes a jump, and I noticed that the end of the scrollTrigger also changes its positioning.
When refreshing the page, sometimes it works and doesn't jump, other times the end positioning is not in agreement. 
I don't know if this has to do with the cache.

A part of the code of gsap:

$(window).on("load", () => {
  setTimeout(() => ScrollTrigger.refresh(), 1500);
});

const animation = (params) => {
  const tl = gsap.timeline({
    scrollTrigger: {
      trigger: params.imageContainer,
      scrub: 1,
      pin: params.pin,
      start: () => `center-=50 center`,
      markers: true
    },
  });
  return tl;
};

ScrollTrigger.matchMedia({
  "(min-width: 992px)": () => {
    const tl = animation({
      pin,
      imageContainer,
    });

    tl.fromTo(
      transparencyBox,
      { opacity: 0 },
      { opacity: opacity }
    ).fromTo(
      arrInnerBoxContent,
      { y: 100, opacity: 0 },
      { y: 0, opacity: 1 }
    );
  }
});