31.08.2010, 13:59 | |||||
Красивое горизонтальное меню на jqКрасивое горизонтальное меню для сайта с подсветкой пунктов, сделанное с помощью библиотеки jq. В head кидаем этот код:
Code <script type="text/javascript" src="/js/jquery.sliding-menu.js"></script> <script type="text/javascript"> jQuery(function(){ jQuery('#HorizontalSlidingMenu .SlidingMenu').slidingMenu(); }); </script> <style> body { font-family: "Arial","Verdana","Helvetica"; font-size: 0.9em; margin: 1.5em; } ul.SlidingMenu { list-style: none; padding: 0em; } ul.SlidingMenu a { padding: 0.62em 1.5em; text-decoration: none; color: #FFF; outline: none; } ul.Horizontal li { float: left; } .ClearFix { clear: both; } #HorizontalSlidingMenu { background: url('/images/menubg.png') top left repeat-x; } #HorizontalSlidingMenu li.Background { background: url('/images/bg_menu_right.png') top right no-repeat; } #HorizontalSlidingMenu li.Background div{ background: url('/images/bg_menu.png') top left no-repeat; height: 100%; margin-right: 31px; } В body - это:
Code <div id="HorizontalSlidingMenu"> <ul class="SlidingMenu Horizontal"> <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> </ul> <div class="ClearFix"></div> </div> Затем скачиваем архив и кидаем файлы jquery.sliding-menu.js - в папку js, Материал взят с сайта infoscript.ru
Теги: Скачать Красивое горизонтальное меню на jq
| |||||
Категория: JavaScript's | Просмотров: 4653 | Добавил: antisept | Рейтинг: 4.0/1 | | |||||
Теги: |
Всего комментариев: 1
|
||||||
|
Кроме того, материал перепечатывали с сайта на сайт, ставили... файл можно найти на Вэбочке (название tables_tablichki_dli_foruma.js).