У меня есть сайт ASP.NET MVC (главная страница + страницы содержимого).
На главной странице у меня есть меню. Когда в меню выбраны некоторые параметры, он приводит вас к соответствующему контроллеру и показывает страницу, что нормально, но также показывает подменю. Подменю показывает просто отлично, но проблема кроется в меню. Я не могу заставить css меню работать на меня.
Вот код меню:
<ul id="menuDeveloper">
<li><%= Html.ActionLink("Home", "Index", "Home", new { area = (String)null }, null)%></li>
<li id='idcardselect'><%= Html.ActionLink("IDCard", "Index", "IDCardSelect", new { area = "IDCard_Select" }, null)%></li>
<li><%= Html.ActionLink("Groups", "Index", "GroupSetup", new { area = "Group_Setup" }, null)%></li>
</ul>
Вот CSS, который идет с этим:
ul#menuDeveloper{
font-family: Arial, Helvetica, sans-serif;
font-size: 93%;
float: right;
background: url("images/bg-menu.gif") no-repeat 50% -9px;
margin-right: 22px;
margin-top: 6px;
height: 46px;
width: 541px;
}
ul#menuDeveloper li{
float: left;
margin-left: 20px;
margin-top: 10px;
}
ul#menuDeveloper li a{
color: #6192c1;
padding: 10px 2px 15px 2px;
text-decoration: none;
text-transform: uppercase;
height: 46px;
}
ul#menuDeveloper li a.active{
background: #e0e0e0;
color: #1f67a7;
}
ul#menuDeveloper li a:hover{
background: #e0e0e0;
color: #1f67a7;
}
ul#menuDeveloper li.menuidcardactive
{
background: #e0e0e0;
color: #1f67a7;
}
Весь CSS работает просто отлично, за исключением последней части (класс .menuidcardactive).
Это может быть способ, которым я применяю это. По сути, получается, что элемент
НЕ получает стиль, но элемент получает его часть (только часть фона, «цвет» не изменяется). Я пробовал несколько способов изменения класса. Я просто хочу, чтобы был «активным», пока отображается подменю, поэтому меню «подключается», и пользователь понимает, для чего подменю.
Вот пример того, что я пытался изменить класс для
:
$("#idcardselect").attr('class', 'menuidcardactive');
$("#idcardselect").addClass('menuidcardactive');
$("#idcardselect").removeClass().addClass('menuidcardactive');
Все это было сделано внутри $ (window) .load (function () {}); кодовый блок страницы индекса (при нажатии на пункт меню, в данном случае «IDCard»).
Любые мысли / решения будут с благодарностью.
Спасибо!