Смена картинки при переходе в навигации

[k0missar]

Есть навигация (приведен скриншот)
Есть несколько мени
например упс1, упс2, упс3 и упс4 (спадающие)
нужно чтоб при наведении мыши на упс1 отображалась большая картинка с одним изображение при наведении на упс2 с другим и так далее...
посмотрев на скриншот думаю поймете что я хотел бы реализовать!
Код меню

<ul id="menu">
	<li><a href="#">Oops 1</a></li>
	<li>
		<a href="#">Oops №2</a>
		<ul>
			<li><a href="#">Oops №1</a></li>
			<li><a href="#">Oops №2</a></li>
			<li><a href="#">Oops №3</a></li>
		</ul>
	</li>
	<li>
		<a href="#">Oops №3</a>
		<ul>
			<li><a href="#">Oops №1</a></li>
			<li><a href="#">Oops №2</a></li>
			<li><a href="#">Oops №3</a></li>
			<li><a href="#">Oops №4</a></li>
			<li><a href="#">Oops №5</a></li>
		</ul>
	</li>
	<li>
		<a href="#">Oops №4</a>
		<ul>
			<li><a href="#">Oops №1</a></li>
		</ul>
	</li>
	<li>
		<a href="#">Пункт №5</a>
		<ul>
			<li><a href="#">Oops №1</a></li>
			<li><a href="#">Oops №2</a></li>
			<li><a href="#">Oops №3</a></li>
			<li><a href="#">Oops №4</a></li>
			<li><a href="#">Oops №5</a></li>
		</ul>
	</li>
</ul>

Код CSS

#menu {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-family: Georgia;
	}
#menu li {
	list-style: none;
	float: left;
	height: 33px;
	padding: 0;
	margin: 0;
	width: 150px;
	text-align: center;
	background: #171717;
	position: relative;
	padding-top: 12px;
	}
#menu li ul {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 150px;
	display: none;
	position: absolute;
	left: 0;
	top: 45px;
	}
#menu li ul li {
	float: none;
	height: 33px;
	margin: 0;
	width: 150px;
	text-align: center;
	background: #7F7F7F;
	}
#menu li a {
	display: block;
	width: 150px;
	height: 33px;
	color: #fff;
	text-decoration: none;
	}
#menu li:hover ul, #menu li.jshover ul {
	display: block;
	}
#menu li:hover, #menu li.jshover {
	background: #424242;
	}

 

[Dr.Sheff]

Вставляешь теги ссылкам :

onMouseOver="document.getElementById('id').style.zIndex = 100;"
onMouseOut="document.getElementById('id').style.zIndex = 1;"

Где id название индификатора изображения (#id)
Можно так

onMouseOver="document.getElementById('id').style.display='none';"
onMouseOut="document.getElementById('id').style.display='block';"

сделать ещё.

 

[k0missar]

Вставляешь теги ссылкам :

 onMouseOver="document.getElementById('id').style.zIndex = 100;"
onMouseOut="document.getElementById('id').style.zIndex = 1;"

Где id название индификатора изображения (#id)
Можно через

document.getElementById('id').style.display='none';
document.getElementById('id').style.display='block';

сделать ещё.

А можно по подробней, я пока 0 в php

 

[gres_18]

А можно по подробней, я пока 0 в php

Похоже на правду... Это и не РНР вовсе Тут речь о html и js.
Нужна функция которая в слое с определенным id будет выставлять соответствующую картинку в качестве фона, при наведении курсора на пункты меню.

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

за примером.
Можно еще вот так менять:

document.images["pic1"].src = "pic/pic-1-on.gif";

В общем вариантов много, осталось только выбрать подходящий и написать. Информацию выдал - там в статье есть все что нужно, может кто ради накрутки сообщений и напишет работающий код. Успехофф

 

[k0missar]

Похоже на правду... Это и не РНР вовсе Тут речь о html и js.
Нужна функция которая в слое с определенным id будет выставлять соответствующую картинку в качестве фона, при наведении курсора на пункты меню. *** скрытое содержание *** за примером.
Можно еще вот так менять:

document.images["pic1"].src = "pic/pic-1-on.gif";

В общем вариантов много, осталось только выбрать подходящий и написать. Информацию выдал, может кто ради накрутки сообщений и напишет работающий код

какбЭ могу отличит php от js, просто создал в тем с php, американец мля

 

[Dr.Sheff]

С нулевыми знаниями за работу нельзя браться. Скачайте книгу и почитайте хотя бы про HTML + основы программирования. А если программированием заниматься не планируете введите непонятные Вам термины в гугл и почитайте , что они значат. Подробней тут не объяснить.

 

[trooll]

PHP здесь второстепенный элемент, то что вам необходимо делается на связке CSS+HTML, +PHP для определения текущего пункта меню, Ну эта связка используется если вам нужна статичная реализация.

Если же вы староник прогресса, и так же как и я считаете что современный пользователь должен иметь в браузере поддержку JS, а если ее у него нет он либо бот, либо что то "плохое замыслил". Еще кончено есть вариант что пользователь сидит со специального оборудования, типа телефон, ну это отдельная история.
Ну так вот если вас это все не смущает, можно воспользоваться JS скриптом, что будет на много интереснее. Если интересно то исследуйте выдачу ПС по следующим ключевым и смежным запросам:

jquery выпадающее меню