| Главная » Файлы » Прочие скрипты » jQuery |
Многоуровневое меню с эффектом lavalamp на jQuery
| 23.06.14, 09:09:57 | |
 Довольно-таки качественное многоуровневое меню. Для начала посмотрите ДЕМО Установка: После /head на нужных страницах вставляйте: Код <link type="text/css" href="/css/menu.css" rel="stylesheet" /> <script type="text/javascript" src="/js/menu.js"></script> <style type="text/css"> div#menu { margin-left:120px; position:relative; top:25px; } div#copyright { display: none; } </style> Далее вставляйте в то место, где будет само меню: Код <div id="menu"> <ul class="menu"> <li><a href="#" class="parent"><span>Home</span></a> <div><ul> <li><a href="#" class="parent"><span>Sub Item 1</span></a> <div><ul> <li><a href="#" class="parent"><span>Sub Item 1.1</span></a> <div><ul> <li><a href="#"><span>Sub Item 1.1.1</span></a></li> <li><a href="#"><span>Sub Item 1.1.2</span></a></li> </ul></div> </li> <li><a href="#"><span>Sub Item 1.2</span></a></li> <li><a href="#"><span>Sub Item 1.3</span></a></li> <li><a href="#"><span>Sub Item 1.4</span></a></li> <li><a href="#"><span>Sub Item 1.5</span></a></li> <li><a href="#"><span>Sub Item 1.6</span></a></li> <li><a href="#" class="parent"><span>Sub Item 1.7</span></a> <div><ul> <li><a href="#"><span>Sub Item 1.7.1</span></a></li> <li><a href="#"><span>Sub Item 1.7.2</span></a></li> </ul></div> </li> </ul></div> </li> <li><a href="#"><span>Sub Item 2</span></a></li> <li><a href="#"><span>Sub Item 3</span></a></li> </ul></div> </li> <li><a href="#" class="parent"><span>Product Info</span></a> <div><ul> <li><a href="#" class="parent"><span>Sub Item 1</span></a> <div><ul> <li><a href="#"><span>Sub Item 1.1</span></a></li> <li><a href="#"><span>Sub Item 1.2</span></a></li> </ul></div> </li> <li><a href="#" class="parent"><span>Sub Item 2</span></a> <div><ul> <li><a href="#"><span>Sub Item 2.1</span></a></li> <li><a href="#"><span>Sub Item 2.2</span></a></li> </ul></div> </li> <li><a href="#"><span>Sub Item 3</span></a></li> <li><a href="#"><span>Sub Item 4</span></a></li> <li><a href="#"><span>Sub Item 5</span></a></li> <li><a href="#"><span>Sub Item 6</span></a></li> <li><a href="#"><span>Sub Item 7</span></a></li> </ul></div> </li> <li><a href="#"><span>Help</span></a></li> <li class="last"><a href="#"><span>Contacts</span></a></li> </ul> </div> Теперь залейте файлы из прикреплённого архива следующим образом: menu.css - в папку css menu.js - в папку js все картинки из папки images в такую же папку images вашего файлового менеджера Материал подготовлено Apocalypse | |
| Просмотров: 465 | Загрузок: 0 | | |
| Всего комментариев: 0 | |
|
| |