Вторник, 26.01.2021, 18:59
Главная  Форум Регистрация Блог RSS
Приветствую Вас, Гость
Меню сайта

Наш опрос
Пользуютесь ли вы переводчиком у нас на сайте?


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

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


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

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

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

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

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


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

установить такой блок
Поиск



установить такую кнопку twitter
или такую
красивая кнопка Twitter

Расскажи Друзьям!
Топ комментаторов

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

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

Стильное и красивое меню на uCoz

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

В этом материале вы можете найти очень стильное и красивое меню для uCoz в светло-красном тоне, но все цвета и картинки можно под настроить под себя и под дизайн вашего сайта. Код 100% рабочий, так как подготовлен и проверен нашем модератором Apocalypse, за что ему в очередной раз огромное спасибо. Установка не самая лёгкая, но и не сложная - всё будет установлено за несколько шагов. Для начала скачайте архив в материале и файл .css загрузите через файловый менеджер в папку /css ( если такой папки у вас там не будет, то просто создайте её и всё )

  • На городском портале Бугульма можно найти много всего про этот город, а так же и карта Бугульмы с улицами, что будет полезно для очень многих приезжих. Узнайте все детали на сайте www.bugulma.ws.

Далее установка продолжается следующим образом:

В самый верх вашего css вставляйте:

/*
* Меню в стиле Flat
* Автор: Kelin
* Сайт: Web41k.ru
* Рай для WEB-мастера
*/
@import url(/css/icons.css) all;
.ulMenu {background:#fff;border-radius:3px;box-shadow:0 1px 2px #ddd;list-style:none;overflow:hidden;padding:0;}
.liMenu {font:Bold 16px Helvetica,sans-serif;border-bottom:1px solid #ddd;margin:-1px 0;}
.liMenu > a {color:#333;text-decoration:none;display:block;padding:18px;}
.liMenu > a > span[class*=icon-] {margin:0 15px 0 0;}
.liMenu .num {float:right;font-size:11px;color:#fff;background:#2eb398;margin-top:1px;border-radius:50px;padding:2px 10px;}
.liMenu:hover {background:#e76049;}
.liMenu:hover > a, .liMenu.withSub.active > a {color:#fff;}
.liMenu:hover > a > .num, .liMenu.withSub.active .num {background:#c84029;}
.liMenu.active {background:#de4f37}
.ulSubMenu {list-style:none;background:#e76049;padding:0;border-top:1px solid #ec806d;display:none;}
.liSubMenu {color:#fff;font:Bold 12px Helvetica,sans-serif;}
.liSubMenu > a {color:#fcd9d4;text-decoration:none;display:block;padding:10px 10px 10px 25px;}
.liSubMenu:hover > a {color:#fff;}
.liSubMenu > a > span[class*=icon-] {font-size:16px;vertical-align:-2px;margin:0 10px 0 5px;}


В то место, где должно быть само меню, вставляйте:

<ul class="ulMenu">
<li class="liMenu"><a href="#"><span class="icon-home"></span>Главная страница</a></li>
<li class="liMenu"><a href="#"><span class="num">17</span><span class="icon-paragraph-justify"></span>Каталог статей</a></li>
<li class="liMenu withSub active"><a href="#"><span class="num">6</span><span class="icon-list"></span>Меню в стиле Flat</a>
<ul class="ulSubMenu" style="display: block;">
<li class="liSubMenu"><a href="#"><span class="icon-user"></span>by Kelin</a></li>
<li class="liSubMenu"><a href="#"><span class="icon-earth"></span>Web41k.ru</a></li>
<li class="liSubMenu"><a href="#"><span class="icon-quill"></span>Рай для WEB-мастера</a></li>
</ul>
</li>
<li class="liMenu"><a href="http://web41k.ru"><span class="icon-cogs"></span>Вернуться на сайт</a></li>
</ul>

<script>
$('.liMenu.withSub').click(function(){$(this).toggleClass('active').find('.ulSubMenu').slideToggle(500)});
</script>



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



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


- Установить на свой сайт блок социальных закладок
Категория: Меню для uCoz сайта | Добавил: scripts_for_ucoz
Просмотров: 8182 | Загрузок: 62 | Комментарии: 1 | Рейтинг: 0.0/0


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

Хостинг от uCoz