Javascript scroll to next anchor on page with mouse slowly

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
        });
    });
})();

kremalicious · Accepted Answer · 2015-09-02 10:38:31Z

2

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.

answered Sep 2, 2015 at 10:38

kremalicious

1,37111 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Nathaniel Meyer Over a year ago

humm ok works perfectly im very new to this now i feel a bit silly thanks :)

kremalicious Over a year ago

no problem, we all started like that :-) Would appreciate if you could mark my answer as best one if it helped you

Collectives™ on Stack Overflow

Javascript scroll to next anchor on page with mouse slowly

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related