Triggering custom animations on scroll

Hi, I am working on a site for a client and have added a custom animation to make elements blur and disappear. However, I want this to happen as the user scrolls down the page, not on page load.
I've tried a few things unsuccessfully - any ideas? I think using Intersection Observer might be the right avenue but I'm having trouble with it.

Hi,

Can you share link to page where you use animation?