Пятница, 29.03.2024, 07:33
Скрипты для Ucoz
Карта сайта
Главная | Скрипт красивого, оригинального, раздвижного фото меню - Скрипты для Ucoz



Книги для вебмастера
Новые сообщения Участники Правила форума Поиск Лента новостей
  • Страница 1 из 1
  • 1
Скрипты для Ucoz » Всё для Ucoz » Скрипты для Ucoz » Скрипт красивого, оригинального, раздвижного фото меню
Скрипт красивого, оригинального, раздвижного фото меню
bandjukДата: Вторник, 31.07.2012, 21:53 | Сообщение # 1
Генерал-лейтенант
Группа: Администраторы
Пол:
Награды: 22
Репутация: 22
Сообщений: 615
Бог сайта и форума За дизайнерские умения За уважение народа За хорошую посещаемость на форуме за 100 постов
Представляю вашему вниманию скрипт красивого, раздвижного фото меню, которое отлично подойдёт для сайтов с тематикой фото, кино и т.д.
В место, где должно быть меню, ставите код:

Code

<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>

Прописываем адреса и название пунктов меню:
Quote
<a href="">Пункт 1</a>
<a href="">Пункт 2</a>
<a href="">Пункт 3</a>

и т.д.



Источник: http://fotki.ucoz.ua
 
Скрипты для Ucoz » Всё для Ucoz » Скрипты для Ucoz » Скрипт красивого, оригинального, раздвижного фото меню
  • Страница 1 из 1
  • 1
Поиск:

Яндекс.Метрика
Copyright Глюк Рекордс © 2024

Создать бесплатный сайт с uCoz