0

レイアウトが大きいので、jQueryとHTML（http://www.gronge.com/index3.phpのフルサイト）にリンクしている部分だけ掲載します。Firebug インスペクションで About リンクが .navBarActive に戻ることを除いて、すべて正常に動作しますが、視覚的には変化しません。私はウェブデザインを始めたばかりで、これはこれまでの最初の大きな問題でした.

jQuery

$(document).ready(function() {
    $("li.navBarNormal").click(function () {
        $("li.navBarActive").removeClass("navBarActive").addClass("navBarNormal");
        $(this).removeClass("navBarNormal").addClass("navBarActive");
    })
});

HTML

<ol id="navLinks"> 
    <li id="navLinkAbout" class="liNav fontWhite navBarActive">About</li>
    <li id="navLinkSubscribe" class="liNav fontWhite navBarNormal">Subscribe</li>
    <li id="navLinkNews" class="liNav fontWhite navBarNormal">News</li>
    <li id="navLinkUpdates" class="liNav fontWhite navBarNormal">Updates</li>
    <li id="navLinkContact" class="liNav fontWhite navBarNormal">Contact</li>
</ol>
4

2 に答える 2

1

これを試してください：http://jsfiddle.net/treyeckels/DgQfw/

イベント トリガーを「li.liNav」に変更します。これにより、イベント ハンドラーがすべてのリンクに適用されます。次に、これ (クリックされたもの) に対して追加/削除アクションを実行し、トラバースして兄弟を見つけ、それらの追加/削除アクションを実行します。

$(document).ready(function() {
$("li.liNav").click(function() {
    $(this).removeClass("navBarNormal").addClass("navBarActive").siblings().removeClass("navBarActive").addClass("navBarNormal");
}) });​
于 2012-08-20T04:20:13.743 に答える