Что нужно сделать, чтобы добавить возможность прокрутки по горизонтали для блока?

Для добавления возможности горизонтальной прокрутки для блока, можно использовать CSS свойство `overflow-x: scroll;`. Необходимо применить это свойство к нужному блоку.

Пример:

```html
<style>
  .scrollable-block {
    overflow-x: scroll;
    white-space: nowrap; /* чтобы содержимое блока не переносилось на новую строку */
  }
</style>

<div class="scrollable-block">
  <!-- содержимое блока -->
</div>
```

Чтобы остановить вертикальную прокрутку `body` при наведении на блок, можно использовать JavaScript. Необходимо добавить обработчик события `mouseover` на блок и внутри него вызвать функцию, которая будет добавлять CSS свойство `overflow: hidden;` к `body`.

Пример:

```html
<style>
  .scrollable-block {
    overflow-x: scroll;
    white-space: nowrap; /* чтобы содержимое блока не переносилось на новую строку */
  }
</style>

<script>
  const block = document.querySelector('.scrollable-block');
  const body = document.querySelector('body');

  block.addEventListener('mouseover', stopScroll);

  function stopScroll() {
    body.style.overflow = 'hidden';
  }
</script>

<div class="scrollable-block">
  <!-- содержимое блока -->
</div>
```

Когда курсор будет наведен на блок, `body` будет иметь `overflow: hidden;`, таким образом, блокировав вертикальную прокрутку `body`.