Home Ask Login Register

Developers Planet

Your answer is one click away!

Razwanul Ghani Rifat February 2016

Bootstrap nav menu. Close it on click to any of its item

I am using the following html code:

  <nav class="navbar navbar-default">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav list-inline">
          <a href="#" v-on:click.prevent="showHomepage">
            <span class="btn btn-default btn-sm">Home</span>
        <!-- Other Items ..... -->

How can i make the menu items closed when a li items is clicked on the small screen?


Paradoxetion February 2016

You could do it with jQuery easily:

    if (jQuery(".navbar-toggle").is(":visible")) { //check if menu button visible
      jQuery(".nav-menu li").click(function() {    
        jQuery(".navbar-toggle").trigger("click") // emulate click on menu button to close menu

Post Status

Asked in February 2016
Viewed 1,509 times
Voted 10
Answered 1 times


Leave an answer

Quote of the day: live life