Вход

Просмотр полной версии : Нужно выпадающее меню))


iGusse
07.02.2010, 12:20
Здравствуйте мне нужно сделать 2 варианта меню:
1) чтобы выпадало вверх
2) чтобы выпадало вниз
+ первому пункту присваивается class скажем first-item, а к последнему last-item.

Меню сейчас выводится вот так:
<div id="mainmenu">
<ul>
<li><a href="#">Услуги</a>
<ul>
<li><a href="">Продвижение сайтов</a></li>
<li><a href="">Разработка сайтов</a></li>
<li><a href="">Управление сайтом</a></li>
<li><a href="">Контекстная реклама</a></li>
<li><a href="">SEO-копирайтинг</a></li>
<li><a href="">Фирменный стиль</a></li>
<li><a href="">Продвижение сайтов</a></li>
<li><a href="">Разработка сайтов</a></li>
<li><a href="">Управление сайтом</a></li>
<li><a href="">Контекстная реклама</a></li>
<li><a href="">SEO-копирайтинг</a></li>
<li><a href="">Фирменный стиль</a></li>
</ul>
</li>
<li><a href="">Цены</a>
<ul>
<li><a href="">Продвижение сайтов</a></li>
<li><a href="">Разработка сайтов </a></li>
<li><a href="">Контекстная реклама</a></li>
</ul>
</li>
<li><a href="#">Портфолио</a></li>
<li><a href="#">Контакты</a></li>
</ul>
</div>

Сейчас на кошельке есть 240 рублей) кто-нибудь сможет помочь мне?

12345c
07.02.2010, 13:43
(Наверное, эти деньги покроют только чтение ТЗ, если оно есть. Или пару часов разговора по этому ТЗ. Но на сайтах фрилансеров часто попадаются такие предложения от 0$ за работу, где условием договора со стороны исполнителя также будет хвалебный отзыв с Вашей стороны.)

Tim
08.02.2010, 01:05
HTML надо немного подправить
<ul id="mainmenu">
<li><a href="#">Услуги</a>
<ul>
<li><a href="">Продвижение сайтов</a></li>
<li><a href="">Разработка сайтов</a></li>
<li><a href="">Управление сайтом</a></li>
<li><a href="">Контекстная реклама</a></li>
<li><a href="">SEO-копирайтинг</a></li>
<li><a href="">Фирменный стиль</a></li>
<li><a href="">Продвижение сайтов</a></li>
<li><a href="">Разработка сайтов</a></li>
<li><a href="">Управление сайтом</a></li>
<li><a href="">Контекстная реклама</a></li>
<li><a href="">SEO-копирайтинг</a></li>
<li><a href="">Фирменный стиль</a></li>
</ul>
</li>
<li><a href="">Цены</a>
<ul>
<li><a href="">Продвижение сайтов</a></li>
<li><a href="">Разработка сайтов </a></li>
<li><a href="">Контекстная реклама</a></li>
</ul>
</li>
<li><a href="#">Портфолио</a></li>
<li><a href="#">Контакты</a></li>
</ul>

#mainmenu {
width: 150px;
}

#mainmenu li {
border: 1px solid #cccccc;
list-style: none;
position: relative;
padding: 5px 5px 5px 25px;
}

#mainmenu ul li {
padding: 2px 2px 2px 25px;
width: 200px;
}

#mainmenu ul {
position: absolute;
left: 108px;
top: 0px;
display: none;
}

#mainmenu li:hover ul {
display: block;
}

Проверено в Opera 10 и FF 3.6 в IE будет баг для него нужно скрипты применять.