如何更改我的代码菜单,以便在点击后更改所选菜单标签的颜色?这是我的代码:
PHP
<div class="meniu-item" onclick="$('#content').load('_core/home.php?rand='+Math.random()); window.location.hash = 'home'; ">Home</div>
<div class="meniu-item" onclick="$('#content').load('_core/after-login.php?what=help&rand='+Math.random()); window.location.hash = 'help'; ">Contact</div>
CSS
.meniu-item {
display:block;
float:left;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fdfdfd), color-stop(1, #f1f1f2) );
background:-moz-linear-gradient( center top, #fdfdfd 5%, #f1f1f2 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#f1f1f2');
background-color:#fdfdfd;
border-right:1px solid #e0e0e0;
color:#333333;
font-family:Verdana;
font-size:10px;
font-weight:bold;
padding:4px 0 0 0;
text-decoration:none;
text-shadow:1px 1px 0px #ffffff;
cursor:pointer;
height:25px;
color:#4d4d4d;
width: 97px;
text-align:center;
margin-top: 6px;
line-height: 2;
}
示例:
http://www.codeproject.com/KB/webforms/MenuControlSelectedItem1/EndProduct1.JPG
答案 0 :(得分:1)
类似的东西:
<div data-uri="_core/home.php" class="meniu-item">Home</div>
<div data-uri="_core/after-login.php" class="meniu-item">Contact</div>
使用jQuery:
$("div.meniu-item").on("click", function()
{
$('#content').load($(this).data("uri"));
window.location.hash = $(this).text().toLowerCase();
// Remove the class 'selected' from all navigation items first.
$("div.meniu-item").removeClass("selected");
// Then add it to the one we clicked.
$(this).addClass("selected");
});