jQuery горизонтальное меню - это весьма полезный и популярный метод для вывода меню на твоем сайте.
Многие годы менялись способы вывода меню для сайта, однако, в какой-то момент разработчики популярных сервисов пришли практически к единому способу вывода меню. Различные библиотеки участвуют в таком способе, но самой популярной на сегодняшний день, конечно же, является именно jQuery.
Выпадающее меню на jQuery легко организовать, используя следующие библиотеки (если у тебя уже добавлен jQuery на странице, то его выводить повторно не надо):
<script type="text/javascript" src="/menu/jquery.min.js"></script>
<script type="text/javascript" src="/menu/jqueryslidemenu.js"></script>
также необходимы задать CSS вид нашему меню, чтобы оно выглядело именно так, как этого требует клиент или же разработчик.
<link rel="stylesheet" type="text/css" href="/menu/jqueryslidemenu.css" />
Если ты фанат IE, то можешь сделать небольшой хак для более корректного отображения в IE 7:
<!--[if lte IE 7]>
<style type="text/css">
html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->
Структура меню. Контейнер, в котором все это должно лежать имеет следующие id и class:
<div id="myslidemenu" class="jqueryslidemenu">ЗДЕСЬ КОД МЕНЮ</div>
Само меню выглядит обычно так:
<ul>
<li><a href="#">Справка</a></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>
<ul>
<li><a href="#">Уроки</a></li>
<li><a href="#">Видеоуроки</a>
<ul>
<li><a href="#">Работа с HTML</a></li>
<li><a href="#">Работа с CSS </a></li>
<li><a href="#">Работа с PHP</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Автоматизация</a></li>
<li><a href="#">Секреты</a></li>
</ul>