Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 10.05.2011, 23:08   #1
pavelslap
Пользователь
 
Регистрация: 08.02.2009
Сообщений: 73
Радость background onclick

Добрый день.
У меня есть табличное меню.
Код HTML:
<table border='0' cellpadding='0' cellspacing='0' width='600' class='menu1'>
		<tr>
			<td onClick="document.location='?page=tournament';">Турнир</td>
			<td onClick="document.location='?page=club'">Клуб</td>
			<td onClick="document.location='?page=photo'">Фото</td>
			<td onClick="document.location='?page=video'">Видео</td>
		</tr>
	</table>
styles.css:
Код:
.menu1{
	border-collapse:collapse;
	font-family:Verdana;
	font-size:15px;
}

.menu1 td{
	width:150px;
	height:30px;
	border:1px solid black;
	text-align:center;
	vertical-align:middle;
}

.menu1 td:hover{
	background:#FF950E;
	cursor:pointer;
}
Надо сделать чтобы при нажатии на ячейку, она закрашивалась цветом #FF950E и оставалась закрашена (этим мы даём понять юзеру, что находимся в данной категории).
Я пробовал разными путями, но у меня закрашивалось лишь на момент нажатия, а надо чтобы оставалось до тех пор, пока не переключимся на другую категорию.
Дайте выход.
pavelslap вне форума Ответить с цитированием
Старый 10.05.2011, 23:49   #2
misher
Участник клуба
 
Аватар для misher
 
Регистрация: 26.05.2010
Сообщений: 1,648
По умолчанию

Могу только показать пример. В котором будет закрашиваться текст. Вот css
Код:
#menu-box {
background: #323232 url('../img/menu-bg.gif') repeat-x 0 0;
border-bottom: 1px solid #3B3B3B;
}

#menu {
width: 900px;
margin: 0 auto;
background: #323232 url('../img/menu-bg.gif') repeat-x 0 0;
}

#menu li {
display: inline;
list-style-type: none;
text-align: center;
}

#menu li a {
font-size: 1.1em;
color: #FFFFFF;
font-weight: bold;
float: left;
display: block;
padding: 0 1.6em;
line-height: 35px;
background: url('../img/li-border.gif') no-repeat 100% center;
}

#menu li a:hover, #menu li a.active {
font-weight: bold;
color: #FFCB5C;
}
а вот html
Код:
<!-- Menu -->
	<div id="menu-box" class="cleaning-box">
	<a href="#skip-menu" class="hidden">Skip menu</a>
		<ul id="menu">
			<li><a href="index.html" class="active">Главная</a></li>
			<li><a href="about.html">Обо мне</a></li>
			<li><a href="http://misher.ru/wp-admin/install.php">Связаться со мной</a></li>
			<li><a href="http://misher.ru/forum/upload/forum.php">Форум</a></li>
			<li><a href="faq.html">F.A.Q.</a></li>
		</ul>
	</div>
	<!-- Menu end -->
This world will never be What I expected (c)
misher вне форума Ответить с цитированием
Старый 11.05.2011, 00:02   #3
SkyM@n
Laravel/Vue expert
Старожил Подтвердите свой е-майл
 
Аватар для SkyM@n
 
Регистрация: 08.08.2007
Сообщений: 2,832
По умолчанию

юзайте jQuery вконце концов.
SkyM@n вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Background HTML Guzal HTML и CSS 10 30.11.2010 20:23
CSS Background bill HTML и CSS 1 28.10.2010 22:03
background-color, не работает, почему? shadowsman HTML и CSS 4 22.10.2010 02:59
Background в wordpress (картинка) ziim WordPress и другие CMS 0 23.06.2010 16:07