Горизонтальная бесконечная прокрутка изображений ⇐ CSS

[Anonymous]

У меня есть этот код для изображений, которые отображаются для бесконечного слайда, и он отлично работает, но как только я добавляю overflow-x: прокрутите до логотипа div, он больше не бесконечен, и я не могу прокручивать в обоих направлениях.
>
-->Чего я хочу добиться, так это автоматического перемещения изображений, но в то же время я могу самостоятельно прокручивать их вперед и назад, и это не влияет на автоматическое скольжение.

HTML



















var copy = document.querySelector(".logos-slide").cloneNode(true); document.querySelector(".logos").appendChild(копия); CSS
.logos::-webkit-scrollbar { дисплей: нет; } @keyframes слайд { от { преобразование: TranslateX (0); } к { трансформировать: TranslateX (-100%); } } .logos { переполнение: прокрутка; переполнение-х: прокрутка; отступ: 60 пикселей 0; пробел: nowrap; положение: относительное; } .logos:перед, .logos:после { позиция: абсолютная; верх: 0; ширина: 250 пикселей; высота: 100%; содержание: ""; z-индекс: 2; } .logos:click .logos-slide { состояние анимации-воспроизведения: приостановлено; } .logos-slide { отображение: встроенный блок; анимация: слайд 5 с, бесконечный линейный; } .logos-slide img { высота: 100 пикселей; поле: 0 2,5 пикселя; фильтр: тень (0px 0px 10px rgba (0, 0, 0, 0,75)); }