АРМАДА
Как выделить активный пункт меню?
Новая тема Написать ответ Advanced Hosters - профессиональный хостинг

jusava1982 + +
Опытный
Зарегистрирован: 20.12.2012
Сообщений: 162
Обратиться по нику
# Добавлено:Вс Dec 23, 2012 5:19 amДобавить в избранноеОтветить с цитатой
Как выделить активный пункт меню, то есть, переходите вы по ссылке в главном меню сайта, и будучи на этой странице нажатый пункт меню каким-то образом выделяется? Просьба помочь разобраться...

СSS

ul#menu {list-style-type:none; margin:0; padding:0;}

ul#menu li a{
color:#909090;
background: url(http://wallaby.ucoz.ru/menu/vert_menu2.png) no-repeat 0 0;
text-decoration:none;
width: 200px;
height: 55px;
display:block;
border:none;
text-shadow: #ddd 2px 2px 0;
}

ul#menu li a:hover{
background-position: 50% 100%;
width: 200px;
height: 55px;
display:block;
color:#fff;
text-shadow: #000 2px 2px 0;
}


HTML

<ul id="menu">
<li><a href="#"><span>Главная</span></a></li>
<li><a href="#"><span>Поиск</span></a></li>
<li><a href="#"><span>Регистрация</span></a></li>
<li><a href="#"><span>Карта сайта</span></a></li>
<li><a href="#"><span>О сайте</span></a></li>
</ul>

TheProLamer
Опытный
Зарегистрирован: 19.09.2011
Сообщений: 236
Обратиться по нику
# Добавлено:Вс Dec 23, 2012 12:17 pmОтветить с цитатой
я обычно решаю такой вопрос путём php-кода, который тупо меняет стиль у заданного(заданных) элемента(-ов)
Акция! Недорогой трансфер доменов.
Доверяемые SSL от $5/год

Hello_Kitty
V.I.P.
Зарегистрирован: 30.04.2007
Сообщений: 10763
Обратиться по нику
# Добавлено:Вс Dec 23, 2012 12:36 pmОтветить с цитатой
Вот как:
http://ru-css.livejournal.com/112682.html
http://stinto.ru/design/how-to-select-the-active-menu-item/

jusava1982 + +
Опытный
Зарегистрирован: 20.12.2012
Сообщений: 162
Обратиться по нику
# Добавлено:Вс Dec 23, 2012 10:54 pmОтветить с цитатой
TheProLamer писал(а):
я обычно решаю такой вопрос путём php-кода, который тупо меняет стиль у заданного(заданных) элемента(-ов)



можете выложить какой нибудь пример пример вашего решения...

TheProLamer
Опытный
Зарегистрирован: 19.09.2011
Сообщений: 236
Обратиться по нику
# Добавлено:Вс Dec 23, 2012 11:47 pmОтветить с цитатой
возьмём скажем два типа пункта меню - menu и menu_active

для главной страницы ссылка скажем ?page=index либо без него.
для странички с прайсом ссылка ?page=price например.

имеем индусский код:
Код:
<?php
if (!isset($page) or @$page=='index'){
echo 'прописываем стиль для главной странички как menu_active';} else {
echo 'прописываем стиль как menu';};
if (@$page=='price'){
echo 'прописываем стиль для price странички как menu_active';} else {
echo 'прописываем стиль для price странички как menu';};
?>



ногами не пинать, это элементарно-простой пример реализации для простого сайта.
чтобы не заморачиваться.
Акция! Недорогой трансфер доменов.
Доверяемые SSL от $5/год

koguja
Свой
Зарегистрирован: 11.01.2013
Сообщений: 15
Обратиться по нику
# Добавлено:Пт Янв 11, 2013 10:12 pmОтветить с цитатой
я тоже применяю свои стили для активного меню (это добавляет модуль меню)

и тогда потом отдельно уже ими управляю в своей группе типо так:

ul#menu li active a{
Новая тема Написать ответ    ГЛАВНАЯ ~ ТЕХНИЧЕСКИЕ ВОПРОСЫ

Перейти:  





Генеральный спонсор



Партнеры