Как добавить класс в ванили JS на ограниченное время?

Question

Я бы хотел отключить прокрутку в JS на несколько секунд. Прямо сейчас у меня есть это, но каждый раз, когда я прокручиваю страницу, которая блокируется на одну секунду, блокировка прекращается, затем я прокручиваю, и она снова блокируется, et c.

Я бы хотел, чтобы блокировка остановилась только один раз после прокрутки страницы. Это мой код:

HTML

<div class="cover" id="cover">
    ...
</div>

<div class="container" id="container">
    ...
</div>

JS

var scrollPosition = window.scrollY;
var cover = document.getElementsByClassName("cover")[0];

window.addEventListener("scroll", function () {
    scrollPosition = window.scrollY;

    if (scrollPosition >= 1) {
        cover.classList.add("cover-close");
        document.body.classList.add("stop-scrolling");
        setTimeout(function() {
            document.body.classList.remove("stop-scrolling");
        }, 1000);
    } else {
        cover.classList.remove("cover-close");
    }
});

Sass

.stop-scrolling 
    height: 100%
    overflow: hidden

У кого-то есть решение? Спасибо!

Answer 1

Я бы добавил переменную, которая проверяет, выполняли ли вы ранее прокрутку и блокировку.

var scrollPosition = window.scrollY;
var cover = document.getElementsByClassName("cover")[0];
var hasBlocked = false;

window.addEventListener("scroll", function () {
    scrollPosition = window.scrollY;

    if (scrollPosition >= 1) {
        cover.classList.add("cover-close");
        if (!hasBlocked) {
            hasBlocked = true;
            document.body.classList.add("stop-scrolling");
            setTimeout(function() {
                document.body.classList.remove("stop-scrolling");
            }, 1000);
        }

    } else {
        cover.classList.remove("cover-close");
    }
});