[рони]

threshold: [0.1, 0.8]

а почитать документацию? функция сработает два раза, когда блок будет виден на 10% и 80% --- 10 почти скрылся -- 80 почти открылся

el.intersectionRatio > .4; --- любое число больше .1 и меньше .8 --- блок виден если true.

нужен полноценный макет с css.
попробуйте так ...

document.addEventListener('DOMContentLoaded', function() {
    const lazyAnimate = divs => {
        divs.forEach(el => {
            let isInView = el.intersectionRatio > .4;
            let div = el.target;
            if (div.classList.contains('site--image---video')) div.classList.toggle('show', isInView);
            let video = div.querySelector('.site--video');
                if (isInView) {
                    video.play();
                    //$(video).bgVideo();?? 
                } else {
                    video.pause();
                    video.currentTime = 0;
                }
        });
    }
    let observer = new IntersectionObserver(lazyAnimate, {
        rootMargin: "0px",
        threshold: [.1, .9] //настроить видимость
    });
    let container = document.querySelectorAll('.site--image---video');
    container.forEach(div => observer.observe(div))
});