Можно ли доработать скрипт запуска и остановки видео при скроле?

Всем привет, подскажите пожалуйста мне нужно сделать на сайте что бы при скроле когда только одно видео попадает в зону видимости, оно автоматически начинало работать а когда пропадало из зоны видимости то видео останавливалось.
Сейчас у меня есть скрипт, который при скроле запускает и останавливает видео, но проблема в том что оно запускает видео не только то что и в зоне видимости и другое видео что есть на сайте одновременно, а мне нужно только что бы запускало то что в зоне видимости, можете подсказать как сделать.
Вот код скрипта который есть сейчас:

<script type="text/javascript">


        var videos = document.getElementsByTagName("video"),
            fraction = 0.8;
        function checkScroll() {

            for(var i = 0; i < videos.length; i++) {

                var video = videos[i];

                var x = video.offsetLeft, y = video.offsetTop, w = video.offsetWidth, h = video.offsetHeight, r = x + w, //right
                    b = y + h, //bottom
                    visibleX, visibleY, visible;

                visibleX = Math.max(0, Math.min(w, window.pageXOffset + window.innerWidth - x, r - window.pageXOffset));
                visibleY = Math.max(0, Math.min(h, window.pageYOffset + window.innerHeight - y, b - window.pageYOffset));

                visible = visibleX * visibleY / (w * h);

                if (visible > fraction) {
                    video.play();
                } else {
                    video.pause();
                }

            }

        }

        window.addEventListener('scroll', checkScroll, false);
        window.addEventListener('resize', checkScroll, false);


    </script>

Сам сайт вот https://www.digitaldesign.com.ua
Подскажите очень надо реализовать именно так