Запретить cкролл колесом мышки в блоке?

Подскажите как сделать что бы при попадании (наведении) на блок со скроллом - скролл всего сайта не останавливался, получается что бы скролл не блокировался, а просто пропускал этот блок?

function scrollCompare() {

    let speed = 2; 

    let scroll = document.querySelector('.compare__body');
    let scrollContent = document.querySelector('.compare__content');
    let scrollMainBlock = document.querySelector('.compare__main-column');

    let left = 0;
    let top = 0;
    let drag = false;
    let coorX = 0;
    let coorY = 0;

    scroll.addEventListener('mousedown', function (e) {
        drag = true;
        coorX = e.pageX;
        coorY = e.pageY;
    });

    document.addEventListener('mouseup', function () {
        drag = false;
        left = scroll.scrollLeft;
        top = scroll.scrollTop;
    });

    scroll.addEventListener('mousemove', function (e) {
        if (drag) {
            this.scrollLeft = left - (e.pageX - coorX) * speed;
            this.scrollTop = top - (e.pageY - coorY) * speed;
        }
    });

    scroll.addEventListener('scroll', function (e) {
        if (window.innerWidth > 768) {
            scrollMainBlock.style.transform = 'translateX(' + this.scrollLeft + 'px)';
            scroll.style.setProperty('--top', scroll.scrollTop + 'px');
        } else {
            scrollMainBlock.style.transform = '';
            scroll.style.setProperty('--top', scroll.scrollTop + 'px');
        }

    });

    document.body.addEventListener('wheel', contScroll);
    scroll.addEventListener('wheel', blockWheel);

    function blockWheel(event) {
        event.preventDefault();
    }

    function contScroll(event) {
        if (event.wheelDelta === -120) {
            this.scrollTop += 53;
        } else {
            this.scrollTop -= 53;
        }
    }

    window.addEventListener('resize',
        e => scroll.dispatchEvent(new CustomEvent('scroll'))
    );
};

scrollCompare();
});


Ответы (0 шт):