Форум

dimas15 · #1 (**permalink**) 23.05.2013, 11:22

Есть бокое меню elizaspb.ru на css, есть необходимость чтобы отображалось так:

Услуги
Мебель на заказ
Работы со стеклом

Продукция
Мебель со склада
Материалы

Оставляем, остальное скрываем и т.д.
при клике на мебель на заказ должны разворачиваться подпункты меню

ksa · #2 (**permalink**) 23.05.2013, 11:32

dimas15, и в чем проблема?

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
#menu-novoe-menyu > li > ul > li > ul {
	display: none;
}
</style>
<script type="text/javascript">
$(document).ready(function (){
	$('#menu-novoe-menyu > li > ul > li').click(function (){
		$('#menu-novoe-menyu > li > ul > li > ul').hide();
		$(this).children('ul').show();
	});
});
</script>
</head>
<body>
<ul id="menu-novoe-menyu" class="act">
<li id="menu-item-2251" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-ancestor current-menu-parent menu-item-2251">
<a>Услуги</a>
<ul class="sub-menu">
	<li id="menu-item-2252" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-42 current_page_item menu-item-2252"><a href="http://elizaspb.ru/mebel-na-zakaz/">Мебель на заказ</a>
	<ul class="sub-menu">
		<li id="menu-item-2669" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2669"><a href="http://elizaspb.ru/mebel-na-zakaz/zakazat-kuhnu/">Кухни на заказ</a></li>
		<li id="menu-item-2258" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2258"><a href="http://elizaspb.ru/mebel-na-zakaz/shkafy-kupe-pod-zakaz/">Шкафы-купе</a></li>
		<li id="menu-item-2259" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2259"><a href="http://elizaspb.ru/mebel-na-zakaz/mebel-dlya-gostinnoj/">Мебель для гостиной</a></li>
		<li id="menu-item-2257" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2257"><a href="http://elizaspb.ru/mebel-na-zakaz/torgovoe-oborudovanie/">Торговое оборудование</a></li>
		<li id="menu-item-2253" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2253"><a href="http://elizaspb.ru/mebel-na-zakaz/shkafy-kupe/">Барные стойки</a></li>
		<li id="menu-item-2316" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2316"><a href="http://elizaspb.ru/mebel-na-zakaz/detskaya-mebel/">Детская мебель</a></li>
		<li id="menu-item-2321" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2321"><a href="http://elizaspb.ru/mebel-na-zakaz/mebel-standartnaya/">Мебель стандартная</a></li>
		<li id="menu-item-2317" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2317"><a href="http://elizaspb.ru/mebel-na-zakaz/po-individual-nomu-proektu/">По индивидуальному проекту</a></li>
		<li id="menu-item-2318" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2318"><a href="http://elizaspb.ru/mebel-na-zakaz/korpusnaya-mebel/">Корпусная мебель</a></li>
		<li id="menu-item-2256" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2256"><a href="http://elizaspb.ru/mebel-na-zakaz/pochaya-mebel-na-zakaz/">Прочее</a></li>
	</ul>
</li>
	<li id="menu-item-2260" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2260"><a href="http://elizaspb.ru/raboty-so-steklom/">Работы со стеклом</a>
	<ul class="sub-menu">
		<li id="menu-item-2261" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2261"><a href="http://elizaspb.ru/raboty-so-steklom/peskostrujnaya-obrabotka-stekla/">Пескоструйная обработка</a></li>
		<li id="menu-item-2262" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2262"><a href="http://elizaspb.ru/raboty-so-steklom/tonirovanie-stekla/">Тонирование стекла</a></li>
	</ul>
</li>
</ul>
</li>
<li id="menu-item-2231" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2231"><a>Продукция</a>
<ul class="sub-menu">
	<li id="menu-item-2232" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2232"><a href="http://elizaspb.ru/mebel-so-sklada/">Мебель со склада</a>
	<ul class="sub-menu">
		<li id="menu-item-2233" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2233"><a href="http://elizaspb.ru/mebel-so-sklada/gostinaya/">Гостиная</a></li>
		<li id="menu-item-2234" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2234"><a href="http://elizaspb.ru/mebel-so-sklada/prihozhaya/">Прихожая</a></li>
		<li id="menu-item-2235" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2235"><a href="http://elizaspb.ru/mebel-so-sklada/kuhnya/">Кухня</a>
		<ul class="sub-menu">
			<li id="menu-item-2237" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2237"><a href="http://elizaspb.ru/mebel-so-sklada/kuhnya/domino-mdf/">«Домино» МДФ</a></li>
			<li id="menu-item-2236" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2236"><a href="http://elizaspb.ru/mebel-so-sklada/kuhnya/domino-ldsp/">«Домино» ЛДСП</a></li>
			<li id="menu-item-2239" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2239"><a href="http://elizaspb.ru/mebel-so-sklada/kuhnya/ugolki-dlya-kuhni/">Уголки для кухни</a></li>
			<li id="menu-item-2238" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2238"><a href="http://elizaspb.ru/mebel-so-sklada/kuhnya/mojki/">Мойки</a></li>
		</ul>
</li>
		<li id="menu-item-2254" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2254"><a href="http://elizaspb.ru/mebel-so-sklada/detskaya/">Детская</a></li>
		<li id="menu-item-2293" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2293"><a href="http://elizaspb.ru/mebel-so-sklada/komody/">Комоды</a></li>
		<li id="menu-item-2296" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2296"><a href="http://elizaspb.ru/mebel-so-sklada/stoly-stulya/">Столы и Стулья</a></li>
	</ul>
</li>
	<li id="menu-item-2240" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2240"><a href="http://elizaspb.ru/materialy/">Материалы</a>
	<ul class="sub-menu">
		<li id="menu-item-2241" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2241"><a href="http://elizaspb.ru/materialy/stoleshnitsy/">Столешницы</a>
		<ul class="sub-menu">
			<li id="menu-item-2243" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2243"><a href="http://elizaspb.ru/materialy/stoleshnitsy/stoleshnitsy-ldsp/">Столешницы ЛДСП</a></li>
			<li id="menu-item-2309" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2309"><a href="http://elizaspb.ru/materialy/stoleshnitsy/stoleshnitsa-iz-iskusstvennogo-kamnya/">Столешница из искусственного камня</a></li>
			<li id="menu-item-2308" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2308"><a href="http://elizaspb.ru/materialy/stoleshnitsy/stoleshnitsa-iz-akrilovogo-kamnya/">Столешница из акрилового камня</a></li>
			<li id="menu-item-2307" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2307"><a href="http://elizaspb.ru/proizvodstvo-kamenny-h-stoleshnits/">Производство каменных столешниц</a></li>
			<li id="menu-item-2306" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2306"><a href="http://elizaspb.ru/materialy/stoleshnitsy/stoleshnitsy-dlya-kuhni/">Столешницы для кухни</a></li>
		</ul>
</li>
		<li id="menu-item-2244" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2244"><a href="http://elizaspb.ru/materialy/dsp/">ЛДСП</a>
		<ul class="sub-menu">
			<li id="menu-item-2246" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2246"><a href="http://elizaspb.ru/materialy/dsp/otechestvennoe/">Отечественное ЛДСП</a></li>
			<li id="menu-item-2245" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2245"><a href="http://elizaspb.ru/materialy/dsp/egger/">ЛДСП EGGER</a></li>
		</ul>
</li>
		<li id="menu-item-2247" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2247"><a href="http://elizaspb.ru/materialy/fasady/">Фасады</a>
		<ul class="sub-menu">
			<li id="menu-item-2249" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2249"><a href="http://elizaspb.ru/materialy/fasady/massiv/">Из массив</a></li>
			<li id="menu-item-2250" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2250"><a href="http://elizaspb.ru/materialy/fasady/mdf/">Из МДФ</a></li>
			<li id="menu-item-2248" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2248"><a href="http://elizaspb.ru/materialy/fasady/high-gloss/">HIGH-GLOSS</a></li>
		</ul>
</li>
	</ul>
</li>
</ul>
</li>
</ul>	
</body>
</html>

dimas15 · #3 (**permalink**) 23.05.2013, 15:09

Все хорошо только при переходе на по ссылки оно снова сворачивается, а должно быть активным, пока ссылка активная, хотелось бы так. если не сложно подскажите как это подправить?

ksa · #4 (**permalink**) 23.05.2013, 15:25

Сообщение от dimas15

при переходе на по ссылки оно снова сворачивается, а должно быть активным, пока ссылка активная

На то есть серверные языки... Хеши... Да и сами страницы могут "знать" к то у них главный и "открыть" нужный пункт...

Форум

Справочник

Discord чат

Курсы javascript