1. ホーム
  2. jquery

[解決済み] クリックすると折りたたまれるTwitter Bootstrapのナビゲーションを非表示にする

2022-06-28 16:37:11

質問

これはサブメニューのドロップダウンではなく、写真のようにカテゴリはクラスliです。

レスポンシブメニュー(テンプレートは1ページのみ)からカテゴリを選択すると クリックすると自動的にナビが折りたたまれるようにしたいです。 また、テンプレートが1ページしかないため、ナビゲーションとして使うには ページがあります。私はそれに影響を与えない解決策を求めて、ここでHTMLコードです。 メニューの

    <!-- NAVBAR
  ================================================== -->
<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      </a>
      <a class="brand" href="#">Carousel Demo</a>
      <div class="nav-collapse">
        <ul class="nav" >
          <li class="active"><a href="#home">Home</a></li>
          <li><a href="#about">About</a></li>
          <li><a href="#portfolio">Portfolio</a></li>
          <li><a href="#services">Services</a></li>
          <li><a href="#contact">Contact</a></li>
          <!-- dropdown -->
        </ul>
        <!-- /.nav -->
      </div>
      <!--/.nav-collapse -->
    </div>
    <!-- /.container -->
  </div>
  <!-- /.navbar-inner -->
</div>
<!-- /.navbar -->

どのように解決するのですか?

これを試してみてください。

$('.nav a').on('click', function(){
    $('.btn-navbar').click(); //bootstrap 2.x
    $('.navbar-toggle').click(); //bootstrap 3.x by Richard
    $('.navbar-toggler').click(); //bootstrap 4.x
});