Hello, dear members of the forum!
There is such a question who makes smooth scrolling pages?
At the moment I use NiceCroll, but not everything is so ideally as I would like. Here is an example of my work http://skferson.ru/

Answer 1, Authority 100%

In the firebox unnecessary libraries, jQuery you already have, and here is the code for smooth scrolling, 3 lines:

$ ('. click-menu-element'). Click (function () {
    $ ('HTML, BODY'). Animate ({Scrolltop: $ ('# Elementid'). Position (). Top}, 2000);
});

Where click-menu-element is the menu item, elementid – this is an ID with the title content you need in the place where you need to move (for adjustment You can reduce pixels by 60), 2000 – the speed of transition to the desired element in MS.

Example here

Inside, you can also hang an unnecessary functional for the necessary items to become active, and to determine which item pressed the user. I understand, you have problems with defining an active menu item. 🙂

Answer 2, Authority 50%

Pure JS without library

function smoothscroll (element) {
Element = Document.GetElementByid (Element);
var selectedposx = 0;
var selectedposy = 0;
While (Element! = NULL) {
  selectedposx + = element.offsetleft;
  selectedposy + = element.offsettop;
  Element = element.offsetparent;
}
window.scrollto (selectedposx, selectedposy);
}

and css

html {
 Scroll-Behavior: Smooth;
}

element to which pull

& lt; button class = "btn" onclick = "smoothscroll ('myid')" & gt; there & lt; / button & gt ;
& lt; p id = "myid" & gt; here & lt; / p & gt;

Answer 3

In our video project in the browser, we scroll timeline as video playback. I don’t do a frontendent, but I will try to explain how you did. Have experienced different approaches, stopped at the following:

Animation is made CSS3 Transition – so smooth everything. Long scroll (you do not need it) beats on a series of small. Each next starts at the completion of the previous one. For the eye is not noticeable.