1

うまく機能しているシンプルな Web ページ ナビゲーション バーがあります。現在のページ ナビゲーション リンクが別の色になるようにスタイルを設定します。この場合、現在のページ ナビゲーション リンクに次の色を使用させたいと考えています。

color: #00A1DB;

現在持っているものを示す単純化された jsFiddle をセットアップしました。

http://jsfiddle.net/fmdataweb/BEmXZ/

これが現在のページであることを表すために、Contacts リンクに「current」のクラスを追加しました。ここで、ナビゲーション バーの [連絡先] リンクの色を指定した色に変更するように CSS を変更する必要があります。

過去数時間 CSS をハックしてきましたが、これを機能させるために必要な変更をうまく行うことができません。誰かがこれを実現する方法を教えてくれたら本当に感謝しています-私が現在行っているようにCSSを学んでいます。

ありがとう！

4

4 に答える 4

1

デモを見る

jquery メソッドを使用して、クリックした要素にクラス.addClass()を追加し、他のすべての要素のメソッドを使用してクラスを削除できます。currentlicurrent.removeClassli

$('#nav ul li').on("click",function(){

  $(this).addClass('current');
var siblings =($(this).siblings());


  siblings.each(function (index)
    {
      $(this).removeClass('current');
    });


    });​
于 2012-09-06T08:01:50.950 に答える
0

これは、あなたの望むことですか？http://jsfiddle.net/BEmXZ/2/

重要な部分：

変化する

.sf-menu li.current {
    color: #00A1DB;
}

に

.sf-menu li.current a {
    color: #00A1DB ! important;
}
于 2012-09-06T07:21:29.100 に答える
0

これは、クリックされたときに「現在の」ボタンにクラスを割り当てることで簡単に実現できます。

次のように、CSS を使用してクラスのスタイルを設定できます。

.current {
     background-color: #eee;
}
于 2012-09-06T07:22:32.187 に答える