Главная » 2012 » Март » 16 » JavaScript's: Горизонтальное прокручивающееся меню на jQuery
18:12 JavaScript's: Горизонтальное прокручивающееся меню на jQuery | ||||||||||||
Горизонтальное прокручивающееся меню на jQueryСоветуем посмотреть: src="http://pagead2.googlesyndication.com/pagead/show_ads.js">  Горизонтальное прокручивающееся меню на jQuery ДЕМО МАТЕРИАЛА Шаг 1. Подключим к нашему документу фреймворк jQuery, специальный скрипт для меню и таблицу стилей, отвечающую за внешний вид меню. Для этого пропишем следующий код между тегами head: Code <link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection"/> <script type='text/javascript' language="javascript" src='js/jquery.js'></script> <script type="text/javascript" language="javascript" src="js/jquery.dropdown.js"></script> Шаг 2. В нужном месте (где должно находится меню на сайте) вставим ненумерованный список такой структуры: Code <ul class="dropdown"> <li><a href="#">Высокое меню</a> <ul class="sub_menu"> <li><a href="#">Artificial Turf</a></li> <li><a href="#">Benches & Bleachers</a></li> <li><a href="#">Communication Devices</a></li> <li><a href="#">Dugouts</a></li> <li><a href="#">Fencing & Windscreen</a></li> <li><a href="#">Floor Protectors</a></li> <li><a href="#">Foul Poles</a></li> <li><a href="#">Netting</a></li> <li><a href="#">Outdoor Furniture & Storage</a></li> <li><a href="#">Outdoor Signs</a></li> <li><a href="#">Padding</a></li> </ul> </li> <li><a href="#">Среднее меню</a> <ul class="sub_menu"> <li><a href="#">Artificial Turf</a></li> <li><a href="#">Benches & Bleachers</a></li> <li><a href="#">Communication Devices</a></li> </ul> </li> <li><a href="#">Простое меню</a> <ul class="sub_menu"> <li><a href="#">Artificial Turf</a></li> <li><a href="#">Benches & Bleachers</a></li> <li><a href="#">Communication Devices</a></li> <li><a href="#">Dugouts</a></li> <li><a href="#">Fencing & Windscreen</a></li> </ul> </li> <li><a href="#">Без меню</a></li> </ul> Думаю, что структура этого меню понятна. Меню в целом придается класс dropdown выпадающему списку придается класс sub_menu. При настройках скрипта по умолчанию меню будет анимироваться при наличии хотя бы 7 подпунктов, т.е. при высоте 400. Это значение можно заменить на любое другое в файле скрипта jquery.dropdown.js в первой строке: Code var maxHeight = 400; Думаю, это меню найдет свое место на Ваших сайтах. Спасибо за внимание. Материал взят с сайта infoscript.ru Теги: Скачать Горизонтальное прокручивающееся меню на jQuery
| ||||||||||||