[borzik2h]

Приветствую. Мне нужно замедлить перетаскивание блока. На данный момент сделал так:

<div id="block" style="width: 100px; height: 100px; background:green"></div>

<script>
const block = document.querySelector('#block');

block.addEventListener('mousedown', function(e) {
  const shiftX = e.clientX - this.getBoundingClientRect().left;
  const self = this;
  let speed = 1;

  this.style.position = 'absolute';
  this.style.left = e.pageX - shiftX + 'px';

  function onMouseMove(e) {
    speed = (speed <= 0.5) ? 0.5 : speed - 0.01;
    self.style.left = (e.pageX - shiftX) * speed + 'px';
  }

  function onMouseUp() {
    document.removeEventListener('mousemove', onMouseMove);
    document.removeEventListener('mouseup', onMouseUp);
  }

  document.addEventListener('mousemove', onMouseMove);
  document.addEventListener('mouseup', onMouseUp);
});

block.addEventListener('dragstart', (e) => {
  e.preventDefault();
});
</script>

Но это решение кажется мне каким-то костыльным... Не знаю почему. Как можно еще решить этот вопрос?