Горизонтальная прокрутка

[sergei1980]

Вот статья на сайт

Как создать горизонтально прокручиваемые контейнеры

Контейнеры с горизонтальной прокруткой становятся все более популярными. Особенно среди мобильно оптимизированных сайтов, где они используются для уменьшения высоты веб-страниц. После реализации нескольких таких элементов я захотел выяснить, как с помощью минимального объема кода создать...

internet--technologies-ru.turbopages.org

если там полностью скопировать код, то это точно не работает, более того он очень странен .

может кто то помочь разобраться что хотел донести автор в своем коде.

 

[BaNru]

Посмотри пример работающего кода
https://codepen.io/colinlord/pen/oZNoOO
Всё работает. Только проблема: нельзя колёсиком мыши скролить.
На компе можно только: кликнуть по элементам и курсорами на клавиатуре скролить.
Проблема из-за того,что там скрывается скролл насильно (см. раздел "Полосы прокрутки" в статье)

.scrolling-wrapper::-webkit-scrollbar {
    display: none;
  }
.scrolling-wrapper-flexbox::-webkit-scrollbar {
    display: none;
}

Эта статья скорее для мобильных версий сайта. Чтобы проверить как работает touch необходимо в хроме открыть консоль разработчика (F12) и там нажать на эмуляцию устройств

После чего выбрать любое мобильное устройство

Чтобы было удобнее разбирать понять - вынес примеры отдельно и на чистом CSS, всё работает как надо на компе, без скрытия скролла:

https://itforums.ru/threads/gorizontalnaja-prokrutka.16760/ - JSFiddle - Code Playground

Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.

jsfiddle.net

https://itforums.ru/threads/gorizontalnaja-prokrutka.16760/ - JSFiddle - Code Playground

Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.

jsfiddle.net

 

[sergei1980]

спасибо

 

[Bagabas]

Да годная статья.