Search code examples
jqueryhtmlnavigationslidetoggle

How to Prevent Jquery Slide Toggle Hiding Navigation


My mobile menu works great with slide toggle. The menu is hidden by default, however, when i show the menu and close it in mobile view, then resize the window to show the desktop menu it doesnt appear. The navigation is still hidden despite my efforts to show it?

$(document).ready(function() { //MENU CONTROL
       $('.open-nav').click(function() {
               $('.menu').slideToggle('slow, swing');
               $('.downarrow').toggleClass('flip');
       });
   });

$(document).ready(function(){
    if ($(window).width() < 768) {
      $('.menu').toggleClass('show');
    }
});

Solution

  • Try this, actually you need to check window resize

    $(window).resize(function(){
        if ($(window).width() > 768) {
          $('.menu').toggleClass('show');
        }
    });