При уменьшении, а потом расширении окна браузера некоторые элементы исчезают или перестают работать. Как исправить?

Question

[etherreals]

Сделал адаптивную навигацию.
Есть пара багов:
1. Если мы сужаем и кликаем на мобильное меню, то при клике иногда ничего не происходит.
2. Если при клике меню открылось, то расширив окно обычное меню вообще не появляется.
https://jsfiddle.net/pbwe3h1e/

Answer 1

[Владимир]

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

Comments

[etherreals]

Спасибо за совет, немного стало лучше. Но один момент все равно остался. Если свернуть мобильное меню и расширить экран, то обычно меню пропадает.
https://jsfiddle.net/pbwe3h1e/

[Владимир]

Добавьте при ресайзе проверку: если выходим в десктопное меню, то принудительно отображать его.
Я бы вообще сделал по-другому: по клику манипулировал бы только классами, а скрытие-анимацию делал бы через css

[etherreals]

Вроде бы сделал, но видимо что-то не так
if($(window).width() >=560) {
$('.header-nav').css({'display': 'block'})
}

[etherreals]

jsfiddle.net/pbwe3h1e/1

[etherreals]

разобрался, jsfiddle.net/pbwe3h1e/6