Почему не появляется навигационная панель после изменения разрешения экрана?

Question

[Shine_97]

При разрешении 740px навигационная панель скрывается и открывается по клику на кнопку

Но если кликнуть и открыть список, а потом скрыть и поменять на большее разрешение экрана, то панель не появляется обратно


Подскажите, пожалуйста почему и как это исправить? Ссылка на CodePen

Answer 1

[sergski]

При клике вы для .header__list запускаете метод slideToggle(), который присваивает ему style="display: none", поэтому и не отображается. Следовательно, в вашем случае, нужно убирать атрибут style при ширине больше 740px.

Comments

[Shine_97]

Спасибо! Нашел решение применив:

media (min-width: 740px) {
      .header__list {
             display: block !important;
       }
}

[sergski]

Shine_97, использовать !important плохая практика, лучше из js

$(window).on('resize', function() {
   if( $(this).width() > 740 ) {
      $('.header__list').removeAttr('style');
   }
 });