Javascript用鼠标缓慢滚动到页面上的下一个锚点

Question

I have a single page website with multiple anchors. I am referencing this fiddle example http://jsfiddle.net/kamikazefish/t6LLybx8/201/ for advancing the page to the next anchor when the mouse scrollwheel is used. Is there a way I can control the speed if someone could help would be much appreciated. keep in mind I am very new to code and would love it if it was wrote out not just tell me to add a function or something thanks. Here is the Javascript.

(function() {
    var delay = false;

    $(document).on('mousewheel DOMMouseScroll', function(event) {
        event.preventDefault();
        if(delay) return;

        delay = true;
        setTimeout(function(){delay = false}, 200)

        var wd = event.originalEvent.wheelDelta || -event.originalEvent.detail;

        var a= document.getElementsByTagName('a');
        if(wd < 0) {
            for(var i = 0 ; i < a.length ; i++) {
                var t = a[i].getClientRects()[0].top;
                if(t >= 40) break;
            }
        }
        else {
            for(var i = a.length-1 ; i >= 0 ; i--) {
                var t = a[i].getClientRects()[0].top;
                if(t < -20) break;
            }
        }
        $('html,body').animate  ({
            scrollTop: a[i].offsetTop
        });
    });
})();

Answer 1

You can just add the time during which you want the animation to run like so:

$('html,body').animate({
    scrollTop: a[i].offsetTop
}, 1000);

Where 1000 is the time in ms. If you want it more slow increase this number.