Показать сообщение отдельно
  #2 (permalink)  
Старый 31.12.2010, 14:09
Новичок на форуме
Отправить личное сообщение для Megion Посмотреть профиль Найти все сообщения от Megion
 
Регистрация: 31.12.2010
Сообщений: 1

Лучше так написать

HTML:
<div class="menu-first">
			<span>Пункт 1</span>
			<div class="slide">
				<div class="menu-first-item">
					Подпункт 1
				</div>
				<div class="menu-first-item">
					Подпункт 2
				</div>
				<div class="menu-first-item">
					Подпункт 3
				</div>
			</div>
		</div>
		<div class="menu-first">
			<span>Пункт 2</span>
			<div class="slide">
				<div class="menu-first-item">
					Подпункт 1
				</div>
				<div class="menu-first-item">
					Подпункт 2
				</div>
				<div class="menu-first-item">
					Подпункт 3
				</div>
			</div>
		</div>

JS:
$(document).ready(function(){
				$('.menu-first span').toggle(function()	{
					$(this).parent().find('.slide').slideDown(1000);
				},
				function(){
					$(this).parent().find('.slide').slideUp(1000);	
				});
			});

CSS:
.menu-first {
	background-color: #FF8000;
	color: #6B616D;
	float:left;
	width:10%;
	margin-top: 1%;
	margin-left: 1%;
	padding-left: 2%;
	padding-top: 1%;
	padding-bottom: 1%;
	font-weight: bold;
	font-family: Arial;
	font-size: 10pt;
	cursor: pointer;
	}
	.slide	{
		background-color: #FF8000;
		color: #6B616D;
		display:none;
		padding-left: 2%;
		padding-top: 1%;
		padding-bottom: 1%;
		font-weight: bold;
		font-family: Arial;
		font-size: 10pt; 
		}

Последний раз редактировалось Megion, 31.12.2010 в 14:13.
Ответить с цитированием