Javascript события колеса дает противоречивые значения

event.wheelDelta определяется не во всех браузерах, считается устаревшим и больше не должен использоваться в соответствии с документацию Mozilla. Вы можете использовать значения event.deltaX и event.deltaY. Дополнительную информацию см. в документации по колесу Mozilla.

Я протестировал следующий код в Google Chrome и Mozilla Firefox. Ценности очень разные. Google Chrome всегда возвращает как event.deltaY значение 100 или -100. В Mozilla Firefox он всегда возвращает значения 3 или -3.

document.addEventListener('wheel', function(event) {
    console.log(event.deltaX, event.deltaY);
});

Я бы не стал полагаться на значение колеса, а скорее слушал событие прокрутки, как это описано в Документация прокрутки Mozilla:

var lastKnownScrollPosition = 0;
var ticking = false;

function doSomething(scrollPosition) {
    console.log(scrollPosition);
}

window.addEventListener('scroll', function(e) {
    lastKnownScrollPosition = window.scrollY;
    if(!ticking) {
        window.requestAnimationFrame(function() {
            doSomething(lastKnownScrollPosition);
            ticking = false;
        });
    }
    ticking = true;
});

Используйте event.wheelDeltaY или event.deltaY
console.log(event.wheelDeltaY) для мыши:

для сенсорной панели:

Вместо -120 это дает 0. -120, которое появляется в колесеДельта, на самом деле является результатом горизонтальной прокрутки (wheelDeltaX). (При попытке увеличить масштаб с помощью сенсорной панели также может быть небольшое движение по горизонтали)
Не масштабирование, когда его 0, и вы получите постоянное плавное масштабирование!