0

メニュー項目をクリックしたときにアクティブなメニュー項目のテキストの色がホバリング効果と同じになるようにメニューを作成したい...a:activeを使用しましたが、ページ/コンテンツが開くまでしか機能しません...開いたその効果は失われます..どうすればいいですか..??

メニュー項目のテキストの色のデフォルトとして「黒」の色を使用しているとすると、その色はホバーすると「白」に変わり、コンテンツが読み込まれると「黒」に変わります。別のメニュー項目をクリックするまで「白」のままになります。つまり、「アクティブな」メニュー項目はその色を維持する必要があります(これはすべてのメニュー項目に当てはまるはずです)。この効果を達成するにはどうすればよいですか?

私はjavascriptとjqueryに不慣れです...。

4

3 に答える 3

1

クリックしたときにページが再読み込みされる場合は、バックエンド コードで、選択した要素にクラス名 (「選択済み」など) を追加する必要があります。次に、同じ CSS ルールを :hover としてその要素に適用します。

それ以外の場合、ページを更新せず、「選択された」タイプの状態を維持するために jQuery に依存している場合は、次のようにします。

HTML:

<ul id="menu">
     <li>Item 1</li>
     <li>Item 2</li>
     <li>Item 3</li>
</ul>

jQuery:

$('#menu li').click(function(){
    $('#menu li').removeClass('selected'); // remove selected from any other item first
    (this).addClass('selected'); //add selected to the one just clicked.
});

CSS

#menu li{color:black;background:white;}    
#menu li:hover, #menu li.selected{     
    color:white;background:black;    
    /* CSS properties here will be applied to both hovered */    
    /* and last-clicked item*/     
}    
于 2012-05-14T08:45:02.753 に答える
0

クラスシーケンスを使用する必要があります

1-a:リンク

2-a:訪問した

3-a:ホバー

4-a:アクティブ

于 2012-05-14T10:29:42.147 に答える