Как сделать подвижное меню для сайта?

Question

[Владимир Федоров]

Реализовал 2 меню.
1. Это шапка
2. Боковое меню.
Нужно чтобы при скролле вниз оба меню оставались в поле видимости.

А получается у меня наоборот. Если пролистать вниз, то боковое останется вверху.
А шапку, если сделать фиксированной, то тогда боковое меню перестанет двигать основной контент сайта.

А как сделать, чтобы боковое меню было автоматически закрыто? А то оно всегда открыто, при заходе на страницу.
Спасибо!
fullskill.ru/2 ---- Не реклама, мой личный, учусь

Comments

[pacman123]

Два раза прочитал - ничего не понял.

Answer 1

[Игорь]

Что касаться открытого меню
У вас неправильная логика задана
Потому как
<nav id="sidebar" class="active">
Меню закрыто, и при
<nav id="sidebar" class>
Оно открыто, по простому добавьте class="active", по хорошему поправьте :)

Comments

[Владимир Федоров]

Спасибо

[Игорь]

Владимир Федоров, Если ответ помог, даже частично
Стоит отметить его решением:)
А что бы привязать меню к экрану используйте свойство Sticky или absolute как уже написалии ранее

[Владимир Федоров]

Игорь, Ответ проставлю. Но вот sticky не помогает, да и плюс в абсолюте все смешивается в кашу. Решил проблему по своему, сделал ширину в 100% и position:fixed;
Пока только так получается. Но теперь боковое меню плавает по блоку.

Самое интересное то, что могу сделать приемлимо на вид, но по правильности и по функционалу это будет выглядеть так ( О_О )

[Игорь]

Владимир Федоров, Наступил момент кора стоит посмотреть на фиксед меню от бутстрапа.
По началу попробуйте собирать из готового, потом прейдёт понимание
меню бутстрап 3

Answer 2

[Арсений Матыцин]

Список достаточно обширен:

1. Position: absolute\sticky
   
2. JS манипуляции
   
3. Иные извращения