2016-05-11 6 views
0

Boostrapのナビゲーションに問題があります。mynavbarでclass = "active"を使用し、メニューを押してもスイッチが切れないので、ブートストラップメニューでアクティブ状態が機能しませんそれ以上のアイデアがあるので、助けてください。アクティブ状態がブートストラップメニューで機能していない

ありがとうございました。

<html lang="en"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 

 
    <meta name="description" content=""> 
 
    <meta name="author" content=""> 
 
    <link rel="icon" href="../../favicon.ico"> 
 

 
    <title>Villa Maro</title> 
 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="css/style.css"> 
 

 

 
    <!-- jQuery library --> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
 

 
    <!-- Latest compiled JavaScript --> 
 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 

 

 

 
</head> 
 

 
<body> 
 
    <div class="container"> 
 

 
    <nav class="navbar navbar-default"> 
 
     <div class="container-fluid"> 
 
     <div class="navbar-header"> 
 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbarCollapse"> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      </button> 
 

 
      <a class="navbar-brand" href="#"> 
 
      <img src="images/villa maro logo.png"> 
 
      </a> 
 
     </div> 
 

 

 
     <div class="collapse navbar-collapse navbarCollapse"> 
 
      <ul class="nav navbar-nav navbar-right"> 
 
      <li class="active"><a href="index.html">Naslovna</a> 
 
      </li> 
 
      <li><a href="smjestaj.html">Smjestaj</a> 
 
      </li> 
 
      <li><a href="galerija.html">Galerija</a> 
 
      </li> 
 
      <li><a href="rezervacija.html">Rezervacija</a> 
 
      </li> 
 
      <li><a href="kontakt.html">Kontakt</a> 
 
      </li> 
 
      </ul> 
 
     </div> 
 
     </div> 
 
    </nav>

+0

私はそれをテストし、私のコンピュータで働いた。あなたの 'style.css'ファイルを投稿するか、このファイルにブートストラップのCSSを上書きするものがあるかもチェックしてください。 –

答えて

0
$(".nav a").on("click", function(){ 
     $(".nav").find(".active").removeClass("active"); 
     $(this).parent().addClass("active"); 
    }); 

仕事に連れて行くためのコードのこの短い作品を追加:ここで コードです。

0

class=activeは、現在のページに応じて設定する必要があります。私はどのフレームワークかあなたが使用しているかはわかりませんが、コントローラからの値がactiveクラスを取得するためのテンプレートに戻ります。

あなたは明らかにJavascriptで設定することができますが、これはおそらく私が想定しているものではありません。

使用しているアプリケーション/フレームワークについて詳しく説明していない限り、さらにお手伝いすることはできません。

関連する問題