平滑滚动鼠标滚轮？

除了正常的鼠标滚动速度之外，我想让它更慢，更顺畅，并且与现代浏览器中的一致。平滑滚动鼠标滚轮？

我已经尝试使用NiceScroll（https://nicescroll.areaaperta.com/）这样的插件。

但安装之后，出于某种原因它会发生溢出：隐藏;在我的内容上，不能在任何地方滚动。我不需要任何自定义设计的滚动条。我只需要滚动更顺畅使用鼠标滚动或垂直滚动条的时候是这样的：

会有人请赐教这件事吗？我打算使用skrollr插件（https://github.com/Prinzhorn/skrollr）以及平滑滚动。

2014-11-02 Pau

一些元素，这可能让你去：

$(window).on('mousewheel DOMMouseScroll', function(e) { 
    var dir, 
     amt = 100; 

    e.preventDefault(); 
    if(e.type === 'mousewheel') { 
    dir = e.originalEvent.wheelDelta > 0 ? '-=' : '+='; 
    } 
    else { 
    dir = e.originalEvent.detail < 0 ? '-=' : '+='; 
    }  

    $('html, body').stop().animate({ 
    scrollTop: dir + amt 
    },500, 'linear'); 
})

DOMMouseScroll和e.originalEvent.detail是Firefox所必需的。将amt更改为您希望的滚动距离，并将500更改为您希望的滚动速度。

小提琴：http://jsfiddle.net/utcsdyp1/1

来源

2014-11-02 16:30:53

谢谢你的回答。 :) – Pau 2014-11-02 17:11:14

页面结束时出现一些错误:(特别是当速度比amt小时 – 2014-12-01 10:20:37

@mohsensolhnia，我尝试了速度和'amt'的不同值，但是我没有看到任何错误。从你的控制台，让我知道你使用什么浏览器？ – 2014-12-01 13:57:20

可以使用，当用户滚动$(element).on("scroll", handler)，然后使用捕获一个动作，例如该代码

$('html, body').animate({ 
    scrollTop: $("#target-element").offset().top 
}, 1000);

滚动使用jQuery的

来源

2014-11-02 15:37:29 rberla

我知道。我已经在使用我自己的那个代码版本。我需要的是没有一个目标元素。如果您已经看到了上面的网站：http://pervolo.com/，我的意思是当使用鼠标滚动时，有这种平滑的效果，而不是跳动的默认浏览器之一。 – Pau 2014-11-02 15:40:31

您可以防止页面滚动，而不是在特定数量的像素上滚动文档 – rberla 2014-11-02 16:00:06

我该如何做到这一点？你能编辑你的答案，让我知道它是如何工作在jQuery代码？谢谢。 :) – Pau 2014-11-02 16:04:12

平滑滚动鼠标滚轮？

回答

相关问题