How to apply onmouseup to an element?

Question

JavaScript

Can you tell me how to implement scrolling with the mouse?
While learning JS, I decided to practice creating a responsive slider.
Can't figure out mouse events.
When you click on the slider block, the onmousedown event is triggered, then I pull the block to the side (mousemove), but here is how to correctly write the condition under which:
if you pull the block to the side (for example, equal to the block width), then the scroll is triggered by 1 block.
Link to slider example
Link to scroll slider

<!-- представим, что это слайдер :) -->
<div class="main-block">
  <div class="line-blocks">
    <div class="block">Блок карусели 1</div>
    <div class="block">Блок карусели 2</div>
    <div class="block">Блок карусели 3</div>
    <div class="block">Блок карусели 4</div>
  </div>
</div>

let lineBlock = document.querySelector('.line-blocks');

// клик мышки
lineBlock.onmousedown = function() {

  // следуем за курсором
  lineBlock.addEventListener('mousemove', function(event) {
    lineBlock.style.left = (event.clientX - lineBlock.clientWidth / 2) + 'px'
  });
}

Answer 1

mouseup, like mousemove, apply not to an element, but to the body or parent container of your slide.
mousemove
Each movement of the mouse over an element generates this event.
mouseup
The mouse button is pressed/released over an element.
learn.javascript.ru/mouse-events-basics