Как сделать событие scroll не таким резким?

Question

[Ingernirated]

при попытке прокрутить, резко перемещается на указанное место, а если в функции сделать y +=z, то он не постепенно опускается, а максимально вниз, как это исправить, добавить плавности и контролировать пошаговое перелистывание?

var z = 500;
var y = 0;

function move() {
	y = z;
	window.scrollTo(0,y);
}
window.addEventListener("scroll", move);

Answer 1

[Леха Ярков]

let timer = null;
function scroll() {
  let top = Math.max(document.body.scrollTop, document.documentElement.scrollTop);
  if (top > 0) {
    window.scrollBy(0, ((top + 100) / -10));
    timer = setTimeout(function() {
      scroll();
    }, 20);
  } else {
    clearTimeout(timer);
  }
  return false;
}
scroll();

Вариант с использованием requestAnimationFrame:
https://jsfiddle.net/yarkov_aleksei/fxs215kd/

Comments

[Николай]

requestAnimationFrame уже давно поддерживается во всех браузерах. Зачем вам таймауты?

[Леха Ярков]

Николай: скопипастил из своего старого расширения для браузера. Не заморачивался ))

[Николай]

старое расширение с let/const? ))

[Леха Ярков]

Николай: ну не 100% копипаст. В оригинале глобальных переменных нет.

[Ingernirated]

Леха Ярков: зачем переменной задавать значение null, а не просто написать let timer; ?
Это выражение выдаст наибольшее из всех, что будут в скобках(которых может быть сколько угодно)?

let top = Math.max(document.body.scrollTop, document.documentElement.scrollTop);

И что означает, что чего возвращать фолс? return false;