Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.

  • Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
  • Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
  • Internet Explorer / Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
  • Opera: Нажмите Ctrl+F5.
document.querySelector('.event-container').addEventListener('wheel', function(e) {
    if (e.deltaY > 0) {
        this.scrollLeft += 100;
    } else {
        this.scrollLeft -= 100;
    }
    e.preventDefault();
}, { passive: false });

function adjustContainerSize() {
    var container = document.querySelector('.event-container');
    var blocks = document.querySelectorAll('.event-container .event-block');

    // Рассчитываем общую ширину всех блоков
    var totalWidth = 0;
    blocks.forEach(function(block) {
        totalWidth += block.offsetWidth + 20; // 20px - это предполагаемый margin-right для каждого блока
    });

    // Устанавливаем ширину контейнера равной общей ширине всех блоков
    container.style.width = totalWidth + 'px';
}

// Вызываем функцию при первой загрузке страницы
adjustContainerSize();

// Добавляем обработчик события на изменение размера окна
window.addEventListener('resize', adjustContainerSize);