Плавная прокрутка к якорю на JavaScript без jQuery

На просторах интернета есть приличный скрипт плавной прокрутки к якорю на странице. К сожалению, страница, на которой он находится, далека от топа поисковой выдачи, и, чтобы вам долго не искать, можете смотреть ниже, с подробным описанием, что для чего нужно.

Уникальность этого решения состоит в том, что не требуется тянуть за собой тяжеловесную библиотеку jQuery — если нужна только плавная прокрутка к якорю на странице. Плюс прокрутка происходит по id элемента, и если вдруг к нам на сайт забредет пользователь, у которого отключен JS, или случится еще какая-нибудь незадача, например, прерывание загрузки этой самой jquery — у нас все будет прекрасно работать. И при отключенном JS — будем просто перескакивать по ссылке скачком.

Плавная прокрутка (скролл) к якорю на JavaScript без jQuery

Собственно скрипт плавного скролла к якорю:

var linkNav = document.querySelectorAll('[href^="#"]'), //выбираем все ссылки к якорю на странице
    V = 1;  // скорость, может иметь дробное значение через точку (чем меньше значение - тем больше скорость)
for (var i = 0; i < linkNav.length; i++) {
    linkNav[i].addEventListener('click', function(e) { //по клику на ссылку
        e.preventDefault(); //отменяем стандартное поведение
        var w = window.pageYOffset,  // производим прокрутка прокрутка
            hash = this.href.replace(/[^#]*(.*)/, '$1');  // к id элемента, к которому нужно перейти
        t = document.querySelector(hash).getBoundingClientRect().top,  // отступ от окна браузера до id
            start = null;
        requestAnimationFrame(step);  // подробнее про функцию анимации [developer.mozilla.org]
        function step(time) {
            if (start === null) start = time;
            var progress = time - start,
                r = (t < 0 ? Math.max(w - progress/V, w + t) : Math.min(w + progress/V, w + t));
            window.scrollTo(0,r);
            if (r != w + t) {
                requestAnimationFrame(step)
            } else {
                location.hash = hash  // URL с хэшем
            }
        }
    }, false);
}

HTML разметка:

    <a id="scroll" href="#one">⇩</a> <!-- ссылка, по клику на которую осуществляется прокрутка к якорю -->
    <a id="one" name="one"></a> <!-- якорь, расположенный в произвольном месте страницы --> 

Таким образом, на нашей странице будет осуществляться плавная прокрутка к якорю на странице с помощью JavaScript.

С оригиналом можно ознакомиться по ссылке.