Как создать меню в виде адаптивной карусели?

Question

[Александр Янк]

Вот так меню сверстал:

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


Вот состояние если немного пролистать:



А вот состояние если до конца про листать:


Подскажите способ или лучше пример где что-то похожее есть, буду рад любой помощи и информации.

Answer 1

[Рустамка Воронцов]

overflow hidden
после двигаем блок, вправо или влево

Comments

[Александр Янк]

спасибо за расширенный ответ =))

[Рустамка Воронцов]

Alex Lenk: а что сложного? прячем блоки overflow hidden, далее чекаем ширину блоков и крутим, цифирки через js вывести проблем нет

Answer 2

[Никита Мелихов]

В чём конкретно заключается сложность?

Как вариант - можно посмотреть исходник какой-нибудь карусели или урок по её созданию. Обычно используется viewport (видимый блок с overflow: hidden), в котором находится блок с элементами (фото, пункт меню и т.д.). При "движении" у внутреннего блока меняется горизонтальная позиция (с помощью left или margin).