http://testbcard.dtraduga.vh55.hosterby.com/ Разрешение 767 и меньше. Справа вверху появляется бургер http://joxi.ru/823pZ11fJV919A. При нажатии на него меню выпадающее открывается с какой-то непонятной паузой(задержкой) и не плавно выезжает а резко. Само меню реализовано на bootstrap 4. Из-за чего это все происходит не могу разобраться.
Вот причина проблемы: Код: .my_navbar { display: none; } Если меню изначально невидимо, оно не может плавно развернуться, ибо оно становится видимо только после завершения анимации разворачивания (отсюда и задержка). То есть, на самом деле оно то плавно разврачивается, но в тот момент оно ещё невидимо. Вообще, display: none - это больше, чем просто невидимость, это практически равноценно тому, что блока с этим свойством вообще нет на странице! В данном случае мне непонятно, зачем вообще было добавлено это свойство в собственных стилях, если за меню отвечает Бутстрап, где класс collapse и так скрывает это меню.
Dotrox, ВЫ ГЕНИЙ , я уже хотел меню переделывать потому что уже не мог найти причины. Убрал и открываться стало как положено (это видимо я что-то намутил). С закрытием пауза я так понимаю тоже из-за какой-то мелочи?
Нашел в чем прикол был при закрытии. В меню были такие стили: Код: .my_navbar { height: 100vh; text-align: left; padding-left: 30px; padding-top: 30px; margin-top: 0px; background-color: #030f41; opacity: 0.85; } Все было из-за height: 100vh;, ну т.е. понятно задает 100% высоты видимой области. Вычислить вычислил, но кто объяснит неужели из-за этого могла быть задержка при закрытии?
Снова та же история: если меню задана высота на всё окно браузера, то как оно может плавно свернуться, если сворачивание подразумевает сокращение высоты? Поэтому оно просто ничего не делало пока длилась анимация сворачивания, а потом исчезало, когда Бутстрап навешивал класс collapse. Если вы начнёте воспринимать вёрстку, как реальные физические объекты, а не просто код, у вас перестанут возникать такие вопросы.
Новый прикол. Сразу не заметил. Когда убрал height: 100vh; все стало открываться как положено без глюков, но меню перестало скролится теперь :( Решение нашел путям задания 100vh самому ul вложенному в navbar: Код: div.my_navbar>ul{ height: 100vh; }
