这是我的侧边栏代码
<div><ul class="menusubnav">
<li class="orange"><a href="Managerhomepage.php">Manager</a></li>
<li><a href="addcustomerpage.php">New Customer</a></li>
<li><a href="EditCustomer.php">Edit Customer</a></li>
<li><a href="DeleteCustomerInput.php">Delete Customer</a></li>
<li><a href="addAccount.php">New Account</a></li>
<li><a href="editAccount.php">Edit Account</a></li>
<li><a href="deleteAccountInput.php">Delete Account</a></li>
<li><a href="MiniStatementInput.php">Mini Statement</a></li>
<li><a href="CustomisedStatementInput.php">Customised Statement</a></li>
<li><a href="Logout.php">Log out</a></li>
</ul></div>
这是我的 CSS 代码
.menusubnav li{
margin-top:0px; padding:0;
list-style:none;
}
.menusubnav a{
margin-left:0px;
margin:0px; padding:10px; display:block;
border-bottom: 1px solid #e0e0e0;
font: 12px "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Verdana, sans-serif;
text-decoration:none; color: #333;
}
.menusubnav a:hover{
background-color:#FEF5EE;
}
.menusubnav a:active{
outline:none;
border-color:#ffa853;
background-color:#FF6600;
box-shadow:0 0 10px #ffa853;
}
这是我的 jsfiddle
请帮我解决这个问题。我想聚焦或更改侧边栏菜单的事件链接的颜色。 请帮忙。
最佳答案
只需将一个类添加到事件菜单即可。
.active {
outline:none;
border-color:#ffa853;
background-color:#FF6600;
box-shadow:0 0 10px #ffa853;
}
例如
<div><ul class="menusubnav">
<li class="active"><a href="Managerhomepage.php">Manager</a></li> <--look here
<li><a href="addcustomerpage.php">New Customer</a></li>
<li><a href="EditCustomer.php">Edit Customer</a></li>
<li><a href="DeleteCustomerInput.php">Delete Customer</a></li>
<li><a href="addAccount.php">New Account</a></li>
</ul></div>
因此,当您加载页面时,只需将 class="active"
添加到侧边栏菜单的当前事件链接即可。
更新:
服务器端代码
<div><ul class="menusubnav">
<li <?php if($current_page == Managerhomepage.php){ echo 'class="active"'; } ?> ><a href="Managerhomepage.php">Manager</a></li>
</ul></div>
注意:不完全是如何做到这一点,但这是如何做到这一点的概念。我想您会理解这一点,因为您的链接正在重定向到 php
页面
关于jquery - 如何将事件菜单项聚焦在侧边栏中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19970329/