javascript - 禁用(但仍然允许)滚动

Question

我想在这个网站上重新创建滚动效果:misfitwearables.com。到目前为止，我的方法是禁用用户滚动，但仍然检测滚动方向以允许 jQuery 控制页面的滚动方式。问题是它有效(耶!).. 但它只适用于第一个卷轴。第一次滚动后，它停止响应。我怎样才能让它在每次滚动时都收听/响应？

$(this).bind( 'mousewheel', function ( e ) {
 if (e.originalEvent.wheelDelta < 0) {
    // scroll down
    $("html, body").animate({ scrollTop: (+50) }, 900, "easeInOutQuart" );
 } else {
    // scroll up
    $("html, body").animate({ scrollTop: (-50) }, 900, "easeInOutQuart" );
 }
 return false;
 });

Answer 1

动画属性值不正确，应该是"+=50"和"-=50":

$(this).bind( 'mousewheel', function ( e ) {
 if (e.originalEvent.wheelDelta < 0) {
    // scroll down
    $("html, body").animate({ scrollTop: "+=50" }, 900, "easeInOutQuart" );
 } else {
    // scroll up
    $("html, body").animate({ scrollTop: "-=50" }, 900, "easeInOutQuart" );
 }
 return false;
});

它只工作一次，因为您总是传递 50 和 -50 作为值。

这是一个 working fiddle ，我还添加了一个检查以在每个滚动事件中只执行一个动画