Вторник, 16.04.2024, 14:07
Главная  Форум Регистрация Блог RSS
Приветствую Вас, Гость
Меню сайта
Статьи про uCoz
  • Заказать отзывы на АВИТО у компании Upgrating
  • Что чаще всего рекламируют на билбордах в Санкт-Петербурге
  • Преимущества взрывозащитных тепловентиляторов
  • Интересные факты о майнинге криптовалют
  • Как производится регистрация прав интеллектуальной собственности
  • 5 типичных неисправностей ноутбуков
  • Многофакторная аутентификация как сервис
  • Основные преимущества переезда в Севастополь
  • Почему тонировка автомобилей так популярна
  • Почему оффшор Сент-Винсент популярен у бизнесменов
  • Разработка сайта
  • Что влияет на стоимость сайта?
  • Как самостоятельно создать блог без усилий
  • Как добавить карту сайта в Wordpress
  • В чем заключается SEO-продвижение сайта?
  • Продвижение ссылками – будет ли работать в 2015 году?
  • Программы обработки, сравнения и анализа прайсов
  • Комплексное продвижение сайта как основа репутационного маркетинга
  • У кого заказывать разработку сайта
  • Как создать интернет-магазин?
  • Наш опрос
    Ваше любимое оружие в Counter Strike 1.6


    Всего ответов: 1218

    установить такой вид опроса
    Статистика
    Яндекс.Метрика
    Онлайн всего: 2
    Гостей: 2
    Пользователей: 0


    Зарегистрировано 31217 (сегодня + 0 новых, вчера + 0 новых), В каталоге файлов 1130 материала(ов), Оставлено 5173 комментариев, На форуме создано тем и ответов.

    установить такую статистику

    Блок CW результаты

    Победы
    Победы(10)

    Поражения
    Поражения(5)


    Установить CW блок на свой сайт
    Внимание!
    Наш сайт адаптирован под браузер Mozilla Firefox
    скрипты для uCoz
    Скачать/Download
    В остальных браузерах наш сайт может отображаться некорректно! (IE,Opera,Google Chrome и т.д)

    установить такой блок
    Расскажи Друзьям!
    Комментарии
    Новость: Простое серое меню для uCoz
    NataliShaman написал:
    Приветствую!
    кнопочки мне понравились... только совсем не понимаю - куда именно конкретно вставлять? в какое место в CSS? на каждой странице это делать или один раз установится для всего сайта? у меня шаблон 1088... помогите с установкой, пожалуйста...
    Новость: Простой слайдер новостей и фото изображений на uCoz
    Светлана Кулешова написал:
    Скажите, пожалуйста, а где прикрепленный архив со скриптами?
    Новость: Современные казино онлайн. Как можно выигрывать деньги?
    папап папап написал:
    зарабатывать в интернете может каждый, хочу порекомендовать статью где Вы научитесь это делать играя в казино , заходи смотри http://podshipnik-servis.ru/forum/pyat-prichin-zachem-nuzhno-poprobovat-onlayn-kazino
    Новость: Максимальные выигрыши в казино
    Максим Леонков написал:
    Добрый день, хочу поделиться информацией которая мне помогла зарабатывать в онлайн казино.http://www.rpgarea.ru/news-2890-kakie-bonusi-onlayn-kazino-bivayut-i-gde-ih-nayti.html Например какие какие бонусы онлайн казино бывают и где их найти? где найти казино с лучшими бонусами, Виды бонусов в онлайн казино, какие подарки в клубах бывают для новичков – выдают за регистрацию и активных посетителей – различные акции и пр.Заходи, читай,зарабатывай!

    Читать все комментарии
    Топ комментаторов

    установить такой информер
    VKONTAKTE

    FACEBOOK
    Главная страница » Помощь Вебмастеру » Категория Меню для uCoz сайта » Добавлено [03.02.2013, 18:22]

    Меню на uCoz - горизонтальное тёмное с выпадающими ссылками

    Войти или Зарегистрироваться [скачивать файлы могут только зарегистрированные пользователи!]

    Здорова посетители постоянные и не очень. Сегодня материал подготовлен
    для сайтов, которые трепетно относятся к своему дизайну и к любым
    мелочам. В этой новости Вы найдёте актуальное красивое и стильное горизонтальное меню с выпадающими ссылками для сайта любой тематики на бесплатном хостинге uCoz. Меню создано на новейшем CSS3. План установки CSS и самого HTML кода найдёте чуть ниже в новости.

    # Отмечу, что дизайн меню можно смело настроить под свой сайт, изменив цвет ссылок и заднего фона в CSS коде! Для этого Вам понадобятся минимальные знания HTML и CSS разметки.

    Установка меню:

    # Открываем Админ Панель сайта uCoz
    # Заходим в Дизайн > Управление дизайном > CSS
    # В самый верх копируем следующий код меню

    Код
    /*------------------------------------------*/
    /*--------- Dark Menu Styles Begin ---------*/
    /*------------------------------------------*/

      /* Main Dark Menu Unordered List First Level Style */
      ul.dark_menu {
      list-style: none;
      padding: 0;
      font-family: Arial;
      font-size: 14px;
      line-height: 14px;
      }

      /* Clears all floated List Items */
      ul.dark_menu:after {
      content: "";
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
      }

      /* First Level List Items Style */
      ul.dark_menu li {
      float: left;
      margin: 0 0 0 10px;
      position: relative;
      }

      /* First List Item in First Level Style */
      ul.dark_menu li:first-child {
      margin: 0;
      }

      /* List Items Links Style */
      ul.dark_menu li a, ul.dark_menu li a:link {
      color: #161312;
      text-decoration: none;
      display: block;
      padding: 10px 26px;
       
      /* Text Shadow */
      text-shadow: 0 1px 0 #4b433e;
       
      /* Gradient Background */
      background: #362f2c; /* Old browsers */
      background: -moz-linear-gradient(top, #362f2c 0%, #282321 100%); /* FF3.6+ */
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#362f2c), color-stop(100%,#282321)); /* Chrome,Safari4+ */
      background: -webkit-linear-gradient(top, #362f2c 0%,#282321 100%); /* Chrome10+,Safari5.1+ */
      background: -o-linear-gradient(top, #362f2c 0%,#282321 100%); /* Opera11.10+ */
      background: -ms-linear-gradient(top, #362f2c 0%,#282321 100%); /* IE10+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#362f2c', endColorstr='#282321',GradientType=0 ); /* IE6-9 */
      background: linear-gradient(top, #362f2c 0%,#282321 100%); /* W3C */

      /* Border Radius */
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;

      /* Box Shadows */
      -webkit-box-shadow: inset 0 1px 0 #564b46,
      0 1px 1px #181514;
      -moz-box-shadow: inset 0 1px 0 #564b46,
      0 1px 1px #181514;
      box-shadow: inset 0 1px 0 #564b46,
      0 1px 1px #181514;

      /* Transition Effect */
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease;
      }

      /* List Items Links Hover State Style */
      ul.dark_menu li a:hover {
      color: #73635e;

      /* Text Shadow */
      text-shadow: 0 1px 1px #000;

      /* Gradient Background */
      background: #282321; /* Old browsers */
      background: -moz-linear-gradient(top, #282321 0%, #362f2c 99%, #362f2c 100%); /* FF3.6+ */
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#282321), color-stop(99%,#362f2c), color-stop(100%,#362f2c)); /* Chrome,Safari4+ */
      background: -webkit-linear-gradient(top, #282321 0%,#362f2c 99%,#362f2c 100%); /* Chrome10+,Safari5.1+ */
      background: -o-linear-gradient(top, #282321 0%,#362f2c 99%,#362f2c 100%); /* Opera11.10+ */
      background: -ms-linear-gradient(top, #282321 0%,#362f2c 99%,#362f2c 100%); /* IE10+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#282321', endColorstr='#362f2c',GradientType=0 ); /* IE6-9 */
      background: linear-gradient(top, #282321 0%,#362f2c 99%,#362f2c 100%); /* W3C */

      /* Transition Effect */
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease;
      }

      /* List Items Links Active and Selected State Style */
      ul.dark_menu li a.selected, ul.dark_menu li a:active {
      color: #73635e;
      background: #282321;

      /* Text Shadow */
      text-shadow: 0 1px 1px #000;

      /* Box Shadows */
      -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.6),
      0 1px 0 #5e524f;
      -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.6),
      0 1px 0 #5e524f;
      box-shadow: inset 0 2px 4px rgba(0,0,0,0.6),
      0 1px 0 #5e524f;
       
      /* Transition Effect */
      -webkit-transition: all 1s ease;
      -moz-transition: all 1s ease;
      -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
      transition: all 1s ease;
      }

      /* Sub Menu Unordered List Second Level Style */
      ul.dark_menu li ul {
      display: none;
      }

      /* Before Second Level Unordered List Style */
      ul.dark_menu li ul:before {
      content: " ";
      position: absolute;
      display: block;
      z-index: 1500;
      left: 0;
      top: -10px;
      height: 10px;
      width: 100%;
      }

      /* Sub Menu Unordered List Second Level Style
      When Parent List Item is Hovered */
      ul.dark_menu li:hover ul {
      position: absolute;
      display: block;
      z-index: 1000;
      left: 0;
      top: 44px;
      padding: 5px 0;
      list-style: none;
      background: #282321;

      /* Box Shadows */
      -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.6),
      0 1px 0 #5e524f;
      -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.6),
      0 1px 0 #5e524f;
      box-shadow: inset 0 2px 4px rgba(0,0,0,0.6),
      0 1px 0 #5e524f;

      /* Border Radius */
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      }

      /* Second Level Menu List Items Style */
      ul.dark_menu li ul li {
      float: none;
      margin: 0 10px;  
      border-bottom: 1px solid #191614;
      border-top: 1px solid #3a3230;
      }

      /* First List Item in Second Level Menu Style */
      ul.dark_menu li ul li:first-child {
      margin: 0 10px;
      border-top: 0 none;
      }

      /* Last List Item in Second Level Menu Style */
      ul.dark_menu li ul li:last-child {
      border-bottom: 0 none;
      }

      /* Second Level List Items Links Style */
      ul.dark_menu li ul li a, ul.dark_menu li ul li a:link {
      color: #73635e;
      display: block;
      background: transparent none;
      padding: 10px 20px 10px 5px;
      white-space: nowrap;

      /* Text Shadow */
      text-shadow: 0 1px 2px #000;
       
      /* Box Shadows */
      -webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
      -moz-box-shadow: 0 0 0 rgba(0,0,0,0);
      box-shadow: 0 0 0 rgba(0,0,0,0);

      /* Border Radius */
      -webkit-border-radius: 0px;
      -moz-border-radius: 0px;
      border-radius: 0px;
      }

      /* Second Level List Items Links Hover State Style */
      ul.dark_menu li ul li a:hover {
      text-decoration: underline;
      background: #2a2523;
      }

    /*----------------------------------------*/
    /*--------- Dark Menu Styles End ---------*/
    /*----------------------------------------*/



    # Далее нам нужно скопировать код меню в нужное Вам место. Для этого Вы должны разбираться что где находится в шаблонах uCoz. Самым распространёным вариантом будет копирование кода в Верхнюю часть сайта (GLOBAL_AHEADER).
    # Копируем код меню и меняем пути ссылок и их названия в коде!

    Код
    <ul class="dark_menu">
      <li><a href="http://scripts-for-ucoz.ru/" class="selected">Скрипты для uCoz</a></li>
      <li>
      <a href="http://scripts-for-ucoz.ru/load/3">Шаблоны для uCoz</a>
      <!-- Sub Menu Begin -->
      <ul>
      <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>
      <!-- Sub Menu End -->
      </li>
      <li>
      <a href="http://scripts-for-ucoz.ru/load/11">HTML коды</a>
      <!-- Sub Menu Begin -->
      <ul>
    <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>
      <!-- Sub Menu End -->
      </li>
      <li><a href="/">Контакты</a></li>
      </ul>


    # Внимание: после установки меню нужно ОБЯЗАТЕЛЬНО обновить кэш страницы - для этого нажмите на F5 !!! Готово :)


    При копирование материалов с сайта необходимо указать активную ссылку источника - Скрипты для uCoz 2013 и Меню на uCoz - горизонтальное тёмное с выпадающими ссылками



    Расскажи друзьям интересные новости:


    - Установить на свой сайт блок социальных закладок
    Категория: Меню для uCoz сайта | Добавил: scripts_for_ucoz | Теги: меню на сайт, Меню для ucoz, меню
    Просмотров: 8299 | Загрузок: 0 | Комментарии: 4 | Рейтинг: 5.0/1
    Всего комментариев: 4
    4 Шарлотка   (19.02.2014 23:28) [Материал]
    А как можно добавить пару выпадающих окошек? Маловато мне.
    Подскажитепожалуйста.

    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Для добавления необходима авторизация

    Хостинг от uCoz