1

ユーザーがアイテムの背景色の変更にカーソルを合わせると、ユーザーが他のアイテムをクリックするまでホバー効果が維持されるように、単純なサイドメニューを作成しています

私のコード:

 ul#nav {
    padding: 0;
    margin: 0 0 10px 0;
    -moz-appearance: menubar;
        -webkit-appearance: menubar;
    background-position: left;
    font-size: larger;
}

.mmenu{ width: 190px;
       position: fixed;
}
.mmenu a{
    font-size:14px;
    font-family: Arial, sans-serif;
    font-style: normal;
    font-weight:bold;
    display: block;
}

.mmenu a:hover{ color: white;
background-color: #003366;
font-style: oblique;
border-top: 0px outset #003366;
border-bottom: 0px inset #003366;
border-right:0px outset #003366;
border-left: 0px inset ;
}

ホバー効果は正常に機能していますが、アイテムをクリックしてもスタイルが維持されません。アクティブにして、訪問しましたが、運がありませんでした。誰が問題がどこにあるか知っていますか?

html

<div id="nav" class="mmenu" style="border: 2px double #f2f2f2; left: 25px; width: 200px; border-radius: 6px;">
                            <ul type="none">        
                                        <li><a  href="another example.php">Messages</a></li>
                                        <li><a  href= "example.php">My Conferences</a></li>

                                    </ul>
                                </div>
4

2 に答える 2

2

属性を追加するだけ

Onclick="this.style.background='#003366'"

メニュー項目へ (".mmenu a")

于 2012-05-10T12:57:54.990 に答える
0

ナビゲーション項目をクリックすると、別のページにリンクしていますか? この場合、ナビゲーション項目にクラスを追加し、そのクラスでスタイルを設定する必要があります。

<style>
body.page-name-1 #nav li.page-name-1 a, body.page-name-2 #nav li.page-name-2 a
{
    background-color: #003366;
}
</style>

<body class='<?php echo $page_name ?>'> 
<!-- If you are using PHP, and every page has a $page_name -->
<div id='nav' class='mmenu'>
<ul>
<li class='page-name-1' ><a href="another example.php">Messages</a></li>
<li class='page-name-2' ><a href= "example.php">My Conferences</a></li>
</ul>
</div>
...
</body>
于 2012-05-10T13:14:57.557 に答える