CounterUp2, counting up even when not in viewer

When copying either CounterUp2 from the main page, or the most recent forum post I found that makes my code work: CounterUp JS cancelling the Tabs Hover JS - I'll pay :)

The code on my site:

The animation of the numbers works! HOWEVER, I am not sure how to make it so that the animation ONLY begins when users scroll down and reveal the numbers.

Do you guys have anything I can just copy and paste? Please be as specific as you can, because I am a total noob with JS and web flow in general. Thank you <3

Here is my site Read-Only:

I found the solution! Posting here in case anyone else needs it!

I put this before the tag in whatever page has the counting up numbers.

The: ( ‘.section-numbers’ ) in
const el = document.querySelector( ‘.section-numbers’ )

can be changed to different sections in your page and it should be changed!
Also the 0 in { threshold: 0 } can be changed to different values between 0 and 1 and this will change when the animation starts to happen. 0 is as soon as your section is visible and 1 is as soon as the entire section is visible. With 1 the animation looked glitchy. Numbers were already to max count up value then glitched to 0 and counted up to whatever the were set to at max.

For some reason I can’t post the custom code? Let me try again