简体   繁体   中英

Hide Twitter Bootstrap navbar on click

I wanted to close the mobile navbar on click, I see the answer for my question here . The problem with the code given in this question is that it's always trying to close the navbar, no matter if we see the toggle navbar or the "Normal" navbar. So I want to do an if/else that check if the width is higher or lower that 768px (the width that changes the navbars), so I have this in my document.ready() right now.

 function close_toggle() {
   if ($(window).width() <= 768) {

    $('.nav a').on('click', function(){
        $(".navbar-toggle").click();
    });
 } 
}
close_toggle();

$(window).resize(close_toggle);

The problem with this code is that if I start with a width higher than 768px and go to less than 768px all works good. But if I start with a width lower that 768px when I resize to higher that 768px the normal navbar will blink when I click in the links (because is closing the toggle menu, I think).

So I need an else statement to reverse the if code, but I don't know how to reverse that code. Please sorry for some English errors. Hope someone could help me.

Look if it helps:

 function close_toggle() {
   if ($(window).width() <= 768) {
      $('.nav a').on('click', function(){
          $(".navbar-toggle").click();
      });
   }
   else {
     $('.nav a').off('click');
   }
}
close_toggle();

$(window).resize(close_toggle);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM