GSAP Batch Animation: onEnterBack Fails on Page Reload at Bottom

Hello Bricksforge Team and Community,

I’m facing a persistent issue with ScrollTrigger.batch() that I haven’t been able to solve despite extensive troubleshooting. I’m hoping someone here might have a crucial tip.

My Goal:
I want to animate multiple elements with a class as they enter the viewport. This should work reliably in both directions:

  1. Top to Bottom: When an element enters the viewport while scrolling down (onEnter).

  2. Bottom to Top: When an element enters the viewport while scrolling up (onEnterBack).

Each animation should only be triggered once (once: true).

The Problem:
Scrolling down (onEnter) works perfectly. The issue occurs exclusively when I reload the page while positioned at the bottom (e.g., in the footer):

  1. The page loads with the scroll position at the very bottom.

  2. ScrollTrigger immediately evaluates the state and correctly determines that all .fs-fade-in elements are located before the current scroll position.

  3. As a result, it fires the onEnter callback for every single batch from top to bottom.

  4. Because once: true is set, each of these triggers is immediately destroyed after its onEnter callback runs.

  5. Now, when I start scrolling up, nothing happens. The onEnterBack animation cannot be triggered because the corresponding triggers are already “dead.” The content remains invisible (as it was initially set to opacity: 0 via gsap.set).

What I’ve Already Tried (Without Success):
I’ve attempted virtually every known timing-related fix, but the fundamental evaluation logic of ScrollTrigger remains the issue:

  • Various setTimeout delays (up to 2 seconds).

  • Manually calling ScrollTrigger.refresh() and ScrollTrigger.killAll() before initialization.

  • Temporarily disabling with ScrollTrigger.disable() and re-enabling later with ScrollTrigger.enable().

  • An “interaction gate” that only enables animations after the first user scroll.

My Question:
How can I explicitly instruct ScrollTrigger to ignore this initial state evaluation on page load? Is there a specific Bricksforge setting or a GSAP property that prevents onEnter from firing for triggers that are already “passed” when the page initializes?

It feels like this should be a common scenario, but I simply can’t find the correct solution. I would be extremely grateful for any help or insights.

Thank you and best regards