Меню сайта
АКЦИЯ!!!
Категории раздела
Сервис
Translate my page
Выбрать язык / Select language:
Бесплатное отправление смс сообщений!
Поиск
Календарь
Архив записей
Наш опрос
Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Реклама
Главная » 2014 » Сентябрь » 12 » Скрипт красивого, раздвижного фото меню
19:47
Скрипт красивого, раздвижного фото меню
Представляю вашему вниманию скрипт красивого, раздвижного фото меню, которое отлично подойдёт для сайтов с тематикой фото, кино и т.д. В место, где должно быть меню, ставите код: Код
<link href="http://ssilki.at.ua/files/forum/pictureMenu.css" rel="stylesheet" type="text/css"> <script src="http://ssilki.at.ua/files/forum/pictureMenu.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $(".MainMenu4").pictureMenu({ animateTime: 400, // The duration of the animations menuHeight: 160, // The height of the menu (usually the same as the height of the images) menuWidth: 50, // The length of a menu item (useMenuWidth must be true) menuWidthHover: 50, // The length of the inactive menu items menuActiveWidth: 250, // The length of the active menu items (useMenuActiveWidth must be true) menuInactiveHide: 0.6, // The opacity of the inactive menu items menuBorder: 1, // The Border between the menu items menuAutoOpen: 15, // Menu item that should be open subMenu: ".submenu", // Selector of the submenu fillColor: "#000000", // Color of the menu useMenuWidth: true, // If true: use custom menuWidth. If false: use calculated menuWidth useMenuActiveWidth: true, // If true: use custom menuActiveWidth. If false: use calculated menuActiveWidth leaveActiveOpen: true, // If true, active menu item stay's open after mouse leaves debug: true // Turn on or off the debugger }); }); </script> <style> h1 {font-family: Times New Roman, Times, serif; font-size:15pt; color:#0066CC; text-align:center;} </style> </head> <body style="background:#FFFFFF; text-align: justify;"> <div class="MainMenu4"> <div> <img src="http://ssilki.at.ua/files/forum/menu-1.jpg"> <img src="http://ssilki.at.ua/files/forum/text-1.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> <li><a href="">Пункт 4</a></li> <li><a href="">Пункт 5</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-2.jpg"> <img src="http://ssilki.at.ua/files/forum/text-2.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-3.jpg"> <img src="http://ssilki.at.ua/files/forum/text-3.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-4.jpg"> <img src="http://ssilki.at.ua/files/forum/text-4.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> <li><a href="">Пункт 4</a></li> <li><a href="">Пункт 5</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-5.jpg"> <img src="http://ssilki.at.ua/files/forum/text-5.png"> <ul class="submenu light"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-6.jpg"> <img src="http://ssilki.at.ua/files/forum/text-6.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-7.jpg"> <img src="http://ssilki.at.ua/files/forum/text-7.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/min.jpg"> <img src="http://ssilki.at.ua/files/forum/min8.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/umor9.jpg"> <img src="http://ssilki.at.ua/files/forum/umor9.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-8.jpg"> <img src="http://ssilki.at.ua/files/forum/text-8.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> <li><a href="">Пункт 4</a></li> <li><a href="">Пункт 5</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-9.jpg"> <img src="http://ssilki.at.ua/files/forum/text-9.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> <li><a href="">Пункт 4</a></li> <li><a href="">Пункт 5</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-10.jpg"> <img src="http://ssilki.at.ua/files/forum/text-10.png"> <ul class="submenu dark"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> <li><a href="">Пункт 4</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-11.jpg"> <img src="http://ssilki.at.ua/files/forum/text-11.png"> <ul class="submenu light"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-12.jpg"> <img src="http://ssilki.at.ua/files/forum/text-12.png"> <ul class="submenu light"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> </ul> </div> <div> <img src="http://ssilki.at.ua/files/forum/menu-13.jpg"> <img src="http://ssilki.at.ua/files/forum/text-13.png"> <ul class="submenu light"> <li><a href="">Пункт 1</a></li> <li><a href="">Пункт 2</a></li> <li><a href="">Пункт 3</a></li> <li><a href="">Пункт 4</a></li> <li><a href="">Пункт 5</a></li> </ul> </div> </div> <script type="text/javascript"> var pageTracker = _gat._getTracker("UA-5399114-15"); pageTracker._initData(); pageTracker._trackPageview(); </script></td> <!--Раздвижное меню--> </tr> </table>
Прописываем адреса и название пунктов меню: Код
<a href="">Пункт 1</a> <a href="">Пункт 2</a> <a href="">Пункт 3</a>
и т.д.
Категория: Меню |
Просмотров: 592 |
Добавил: master
| Теги: меню для сайта
| Рейтинг: 0.0 /0
Добавлять комментарии могут только зарегистрированные пользователи.
[
Регистрация |
Вход ]