Как реализовать мобильное меню как у гугла?

Question

[Ratibor]

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

Comments

[Егор Тюваев]

Вы пробовали сами посмотреть, как оно сделано?

[Ratibor]

Егор Тюваев, пытался смотреть

[alex-1917]

вам и правда не стыдно просить готовые решения ваших коммерческих заданий?

[Ratibor]

alex-1917, а вам не стыдно помощь оказывать только за деньги? По моему здесь все на добровольной основе не хочешь, не помогая, и если вам интересно это не коммерческий проект.

[alex-1917]

Ratibor, вы даже ни капли сами не попробовали что-то сами сделать, судя по всем вашим вопросам в ЭТОЙ теме, поэтому вывод - коммерция.
и не путайте помощь и "разжевать и в рот положить"

[Август Милович]

alex-1917, если ты мне, то я тут учусь как бы, не работаю, если не мне, о простите

Answer 1

[Ratibor]

https://codepen.io/RatiboR1978/pen/xPVNbL вот и ответ)

Comments

[Ankhena]

Потрясающе

[PiggyPig]

Фокусы со скроллом будут работать только в webkit-браузерах, а именно в Yandex и Chrome.
В остальных скролл никуда не денется. К тому же если проскроллить до конца, то можно заметить большой отступ, что тоже такое себе удовольствие.

Есть аналог Вашему варианту, но минус в том, что в нем используется не вертикальный скролл, как Ваш, а горизонтальный, поэтому скроллить должным образом будет только на мобильных устройствах (т.к. будет реагировать только на свайпы).

https://jsfiddle.net/x0e6c4x8/2/

В противном случае есть js-коды с ручными скроллбарами, но это уже усложняет структуру меню и делает его беспомощным при выключенном javascript'е.

[Ratibor]

PiggyPig, Спасибо Ваш вариант самое то, мне и надо только для мобилы!

Answer 2

[Максим Грищенко]

Готовая библиотечка есть:
https://github.com/artpolikarpov/scrollyeah

Пример работы у Манн Иванов Фербер:

Answer 3

[xXRustamXx]

https://codepen.io/Metis/pen/EvGgXN

Comments

[Ratibor]

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

[Данил Тивиков]

Ratibor, для этой плашки оverflow-x: auto поставить. Спрятать скролл .element::-webkit-scrollbar { width: 0; }