Javascript 鼠标滚轮平滑滚动

我想在我的网站上创建平滑的滚动效果，如以下网站：

我只找到了以下脚本： 但是当你拿着滚动条滚动页面时，它就不起作用了

以下是我在身体上应用的代码：

(function ($) {


var self = this, container, running=false, currentY = 0, targetY = 0, oldY = 0, maxScrollTop= 0, minScrollTop, direction, onRenderCallback=null,
        fricton = 0.95, // higher value for slower deceleration
        vy = 0,
        stepAmt = 0.8,
        minMovement= 0.3,
        ts=0.1;

var updateScrollTarget = function (amt) {
    targetY += amt;
    vy += (targetY - oldY) * stepAmt;

    oldY = targetY;


}
var render = function () {
    if (vy < -(minMovement) || vy > minMovement) {

        currentY = (currentY + vy);
        if (currentY > maxScrollTop) {
            currentY = vy = 0;
        } else if (currentY < minScrollTop) {
                vy = 0;
                currentY = minScrollTop;
            }

        container.scrollTop(-currentY);

        vy *= fricton;

     //   vy += ts * (currentY-targetY);
        // scrollTopTweened += settings.tweenSpeed * (scrollTop - scrollTopTweened);
        // currentY += ts * (targetY - currentY);

        if(onRenderCallback){
            onRenderCallback();
        }
    }
}
var animateLoop = function () {
    if(! running)return;
    requestAnimFrame(animateLoop);
    render();
    //log("45","animateLoop","animateLoop", "",stop);
}
var onWheel = function (e) {
    e.preventDefault();
    var evt = e.originalEvent;

    var delta = evt.detail ? evt.detail * -1 : evt.wheelDelta / 40;
    var dir = delta < 0 ? -1 : 1;
    if (dir != direction) {
        vy = 0;
        direction = dir;
    }

    //reset currentY in case non-wheel scroll has occurred (scrollbar drag, etc.)
    currentY = -container.scrollTop();

    updateScrollTarget(delta);
}

/*
 * http://paulirish.com/2011/requestanimationframe-for-smart-animating/
 */
window.requestAnimFrame = (function () {
    return  window.requestAnimationFrame ||
            window.webkitRequestAnimationFrame ||
            window.mozRequestAnimationFrame ||
            window.oRequestAnimationFrame ||
            window.msRequestAnimationFrame ||
            function (callback) {
                window.setTimeout(callback, 1000 / 60);
            }; 


})();

/*
 * http://jsbin.com/iqafek/2/edit
 */
var normalizeWheelDelta = function () {
    // Keep a distribution of observed values, and scale by the
    // 33rd percentile.
    var distribution = [], done = null, scale = 30;
    return function (n) {
        // Zeroes don't count.
        if (n == 0) return n;
        // After 500 samples, we stop sampling and keep current factor.
        if (done != null) return n * done;
        var abs = Math.abs(n);
        // Insert value (sorted in ascending order).
        outer: do { // Just used for break goto
            for (var i = 0; i < distribution.length; ++i) {
                if (abs <= distribution[i]) {
                    distribution.splice(i, 0, abs);
                    break outer;
                }
            }
            distribution.push(abs);
        } while (false);
        // Factor is scale divided by 33rd percentile.
        var factor = scale / distribution[Math.floor(distribution.length / 3)];
        if (distribution.length == 500) done = factor;
        return n * factor;
    };
}();


$.fn.smoothWheel = function () {
    //  var args = [].splice.call(arguments, 0);
    var options = jQuery.extend({}, arguments[0]);
    return this.each(function (index, elm) {

        if(!('ontouchstart' in window)){
            container = $(this);
            container.bind("mousewheel", onWheel);
            container.bind("DOMMouseScroll", onWheel);

            //set target/old/current Y to match current scroll position to prevent jump to top of container
            targetY = oldY = container.get(0).scrollTop;
            currentY = -targetY;

            minScrollTop = container.get(0).clientHeight - container.get(0).scrollHeight;
            if(options.onRender){
                onRenderCallback = options.onRender;
            }
            if(options.remove){
                log("122","smoothWheel","remove", "");
                running=false;
                container.unbind("mousewheel", onWheel);
                container.unbind("DOMMouseScroll", onWheel);
            }else if(!running){
                running=true;
                animateLoop();
            }

        }
    });
};


})(jQuery);

（函数（$）{
var self=this，container，running=false，currentY=0，targetY=0，oldY=0，maxScrollTop=0，minScrollTop，direction，onRenderCallback=null，
fricton=0.95，//减速越慢，值越高
vy=0，
步进金额=0.8，
最小移动=0.3，
ts=0.1；
var updateScrollTarget=函数（金额）{
targetY+=金额；
vy+=（目标-旧版）*步进金额；
oldY=targetY；
}
var render=函数（）{
如果（vy<-（最小移动量）| vy>最小移动量）{
电流y=（电流y+vy）；
如果（当前Y>maxScrollTop）{
电流y=vy=0；
}else if（当前<最小值）{
vy=0；
当前y=最小值；
}
container.scrollTop（-currentY）；
vy*=弗里顿；
//vy+=ts*（当前目标）；
//scrollTopTweened+=settings.tweenSpeed*（scrollTop-scrollTopTweened）；
//电流Y+=ts*（目标-电流Y）；
如果（onRenderCallback）{
onRenderCallback（）；
}
}
}
var animateLoop=函数（）{
如果（！运行）返回；
请求动画帧（animateLoop）；
render（）；
//日志（“45”，“animateLop”，“animateLop”，“停止”）；
}
var onWheel=功能（e）{
e、 预防默认值（）；
var evt=原始事件；
var delta=evt.detail？evt.detail*-1:evt.wheelDelta/40；
var-dir=delta<0？-1:1；
if（dir！=方向）{
vy=0；
方向=方向；
}
//如果发生非滚轮滚动（滚动条拖动等），则重置当前值
currentY=-container.scrollTop（）；
updateScrollTarget（增量）；
}
/*
* http://paulirish.com/2011/requestanimationframe-for-smart-animating/
*/
window.requestAnimFrame=（函数（）{
return window.requestAnimationFrame||
window.webkitRequestAnimationFrame||
window.mozRequestAnimationFrame||
window.oRequestAnimationFrame||
window.msRequestAnimationFrame||
函数（回调）{
设置超时（回调，1000/60）；
}; 
})();
/*
* http://jsbin.com/iqafek/2/edit
*/
var normalizeWheelDelta=函数（）{
//保持观察值的分布，并按
//第33百分位。
var分布=[]，完成=空，标度=30；
返回函数（n）{
//零不算数。
如果（n==0）返回n；
//在500个样本之后，我们停止采样并保持当前因子。
如果（完成！=null）返回n*done；
var abs=数学上的abs（n）；
//插入值（按升序排序）。
外部：do{//仅用于break goto
对于（变量i=0；i如果（abs代码的问题是您试图将
smoothWheel
应用于DOM主体。您可以做的是将所有
div
包装在另一个
div
（
id=“wrapper”
）中，并将CSS和JS应用于此
div

HTML

<body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"  type="text/javascript"></script>
    <script src="http://fatlinesofcode.github.io/jquery.smoothwheel/src/jquery.smoothwheel.js" type="text/javascript"></script>
    <div id="wrapper">
        <div></div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
     </div>
</body>

CSS

   $(document).ready(function(){//alert('1')
        $("#wrapper").smoothWheel();
   });

#wrapper {
    height:300px;
    width:100%;
    overflow:auto;
    -webkit-overflow-scrolling: touch;
    background: grey;
}

div {
    height:100px;
    width:100px;
    background:lightblue;
    margin-bottom : 50px;
}

这是一个相同的示例。
您的代码在哪里？对不起，现在您可以看到我的代码了！