Вернуться   Дизайнерский форум » ВЕБ-ПРОГРАММИРОВАНИЕ » HTML, CSS, JavaScript

Активная кнопка в меню

Обсуждение темы Активная кнопка в меню в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Здравствуйте! Запарился с меню на сайте. Просят выделение активного раздела сайта в меню. Т.е., при выборе пункта меню необходимо, чтобы выделение оставалось (в ...


Закрытая тема
 
Опции темы
Старый 21.03.2011, 08:52   #1
Здравствуйте! Запарился с меню на сайте. Просят выделение активного раздела сайта в меню. Т.е., при выборе пункта меню необходимо, чтобы выделение оставалось (в данном случае коричневая кнопка). Запутался в этих active focus

Код HTML:
		<div id="nav">
			<ul>
				<li><a href="index.htm">Главная</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/vac.php">Вакансии</a></li>
				<li><a href="rez.htm">Резюме</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/edu.php">Обучение</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/pub.php">Публикации</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/aboutus.php">Для работодателей</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/search.php">Поиск</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/buy.php">Купить газету</a></li>
				<li><a href="http://www.pro-rabotu.ru/vrb2011/feedback.php">Обратная связь</a></li>
			</ul>
		</div>
Код:

#nav {
color: #660000;
font-size: 13px;
font-family: Century Gothic;
text-align: center;
}

#nav ul {
background: url(images/menu.jpg) repeat-x;
list-style-type: none;
}

#nav li {
display: inline;
margin: 0 4px;
}

#nav li a {
display: inline-block;
color: #660000;
padding: 5px;
height: 28px;
text-decoration:none;
}

#nav li a:hover {
display: inline-block;
background: url(images/nav_bg.jpg) repeat-x;
padding: 5px;
height: 28px;text-align: center;
COLOR: #fff; text-decoration: underline;}
адрес страницы http://www.pro-rabotu.ru/vrb2011/index.php
 
Старый 21.03.2011, 08:52
Ссылки
Старый 21.03.2011, 10:50   #2
Самый простой вариант - добавить такой класс в CSS (активный пункт меню):

Код HTML:
#nav li a.sel {
color: #fff;
background: url(images/nav_bg.jpg) repeat-x;
}
А в меню активный пункт так прописывать:

Код HTML:
<li><a class="sel" href="#">Главная</a></li>
 
Старый 21.03.2011, 12:15   #3
ну я сдал))) Да, это ж самое простое. ПРо сто мозг автоматически искал гемморойное сложное решение какое-нибудь). Спасибо
 
Старый 21.03.2011, 12:15
Закрытая тема


Опции темы


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Меню на cms DLE, вид меню, папки (открыты, закрыты) 74ivan74 Кальянная 0 12.08.2009 20:03
Кнопка OrGadiy Технологии Flash 3 26.05.2008 20:33
кнопка vik7878 ASP, Perl, PHP и MySQL 9 20.07.2006 06:30
кнопка sashas Технологии Flash 6 01.09.2005 19:40
Непростая кнопка Миран Технологии Flash 3 23.02.2005 11:57


Текущее время: 18:32. Часовой пояс GMT +4.

Реклама на форуме Условия размещения рекламы
Биржа ссылок Заработай на сайте!
Тарифный план «Lite»
Место: 1000 Мб
Трафик: неограниченный
Панель управления
Заказать ТП «Lite»
Тарифный план «Normal»
Место: 2000 Мб
Трафик: неограниченный
Поддержка скриптов
Заказать ТП «Normal»
Тарифный план «Profy»
Место: 7000 Мб
Трафик: неограниченный
Поддержка скриптов
Заказать ТП «Profy»
Тарифный план «Места хватит!»
Место: 25 ГБ
Трафик: неограниченный
Поддержка SSI, ssh
Заказать ТП «Места хватит!»
Дизайнерский форум