javascript - 鼠标滚轮在 Firefox 中不起作用

Question

我一直在试图弄清楚为什么我的 smoothscroll 函数在 Firefox 中不起作用？它在其他浏览器(如 Chrome、Microsoft Edge)中运行良好。有人可以帮我吗？请检查这支笔:https://codepen.io/anon/pen/oWPaNx

function smoothScroll(time, distance) {
    var $window = $(window);
    var scrollTime = time;
    var scrollDistance = distance;

    $window.on("wheel mousewheel DOMMouseScroll", function (event) {

        event.preventDefault();
        var delta = event.originalEvent.wheelDelta / 80 || -event.originalEvent.detail / 3;

        var scrollTop = $window.scrollTop();
        var finalScroll = scrollTop - parseInt(delta * scrollDistance);

        TweenMax.to($window, scrollTime, {
            scrollTo: {
                y: finalScroll,
                autoKill: true
            },
            ease: Power4.easeOut,
            overwrite: 5
        });

    });
}

Answer 1

Firefox 中的滚动行为对我来说有点奇怪。

这是我找到的一个讨论mousewheel event is not triggering in firefox browser

function smoothScroll(time, distance) {

  // added this
  var isFirefox = (/Firefox/i.test(navigator.userAgent));
  var scrollEvent = isFirefox ? "DOMMouseScroll" : "mousewheel"

  var $window = $(window);
  var scrollTime = time;
  var scrollDistance = distance;

  // insert scrollEvent var
  $window.on(scrollEvent, function(event) {

    // added this (check if firefox)
    if (!isFirefox) {
      event.preventDefault();
    }

    var delta = event.originalEvent.wheelDelta / 80 || -event.originalEvent.detail / 3;

    var scrollTop = $window.scrollTop();
    var finalScroll = scrollTop - parseInt(delta * scrollDistance);

    // changed window
    TweenMax.to(window, scrollTime, {
      scrollTo: {
        y: finalScroll,
        autoKill: true
      },
      ease: Power4.easeOut,
      overwrite: 5
    });

  });
}

smoothScroll(1.1, 110);