3

我希望在此站点上重新创建滚动效果：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;
 });
4

1 回答 1

1

动画属性值不正确，应该是"+=50"and "-=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作为价值。

这是一个工作小提琴，我还添加了一个检查，每个滚动事件只执行一个动画

于 2013-09-05T05:09:52.540 回答