« Красивое вертикальное меню для uCoz »

Описание материала:

Красивое, светлое вертикальное меню для сайтов в системе uCoz. Меню не требует особых усилий в установке. Что из себя оно представляет: светлое меню, при переходе с ссылке на ссылку оно анимационно меняется и рядом с выбранной категорией появляется звезда.

Установка:

  • Скачиваем архив с сайта и заливаем папку img к себе в корень сайта.
  • Ставим данный код меню, туда где хотите его видеть:
    Код
    <div class="pc-links">
    <li class="hnav_in"><a href="/" title="Главная страница">Главная</a></li>
    <li class="hnav_in"><a href="/video" title="Архив видео">Видео</a></li>  
    <li class="hnav_in"><a href="/stuff" title="Онлайн игры">Онлайн игры</a></li>  
    <li class="hnav_in"><a href="/forum" title="Общительный форум">Форум</a></li>
    <li class="hnav_in"><a href="/publ" title="Разные статьи">Статьи</a></li>  
    <li class="hnav_in"><a href="/dir" title="Отличный ТОП сайтов">ТОП сайтов</a></li>  
    </div>

  • Заходим в ПУ >>> Управление дизайном >>> Таблица стилей (CSS) и ставим в самый низ код:
    Код
    /* Красивое вертикальное меню для uCoz */
    .pc-links a {
      display: block;
      transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      border-top: 1px solid #fff;
      border-bottom: 1px solid #efefef;
      padding: 5px 0px 5px 10px;
      color: #666; }

    .pc-links a:hover {  
      background: #E0E0E0 url('/img/star_icons.png') no-repeat;  
      background-position: 4px 6px;
      padding: 5px 0px 5px 20px;
    }  
    /* ------------------------- */

    Готова!


    Скачать ( Размер архива 0.9 Kb )

    По данной ссылке, Вы можете скачать или купить архив данного материала

    Установка материала

    Мы поможем установить данный материал к Вам на сайт


    Добавил: YaVi | Категория: Скрипты для uCoz | Просмотров: 1112 | Загрузок: 21

    Теги к материалу: вертикальное, красивое, ucoz, для, меню

    Поделиться в соц. сетях:

    К данному материалу нет комментариев, но Вы можете стать первым, оставив свой комментарий!

    Комментариев к материалу: 0
    avatar