Запретить 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();
});