ZorNet.Ru — сайт для вебмастера » Меню для сайта » Раздвижное меню ucoz под шаблон World of tanks

Раздвижное меню ucoz под шаблон World of tanks

Раздвижное меню ucoz под шаблон World of tanks
Меню для сайта uCoz. Меню сайта под шаблон сайта для ucoz World of tanks. Меню в темно желтых тенях по дизайну. Если его устанавливать на другой шаблон надо будит в файловый менеджер в название папки поменять в который он залит в корень сайта. А если под шаблон World of tanks то делаем так.
Установка:
1.Качаем файлы и загружаем в ФМ-> В путь:-> /images/menu_vot/
2.Идем в таблицу стилей, и кидаем код в самый низ:
Код
.side-navigation{width:195px;background:url('/images/menu_vot/76832.png') #291C16;box-shadow:0 0 3px rgba(0, 0, 0, 0.5);-moz-box-shadow:0 0 3px rgba(0, 0, 0, 0.5);-webkit-box-shadow:0 0 3px rgba(0, 0, 0, 0.5);border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;margin-bottom:10px;color:#fff}  
  .side-navigation .block-head{color:#fff;font-size:18px;font-family:arial,tahoma;padding:4px 8px;border-bottom:1px solid #000}  
  .side-navigation .block-inner{padding-bottom:2px}  
  .side-block .block-inner{padding:5px;}  
  .side-block .block-inner.nopadding{padding:0px !important;}  

  .zp-links a{display:block;color:#fff;padding:4px 8px;border-bottom:1px solid #000;border-top:1px solid #3B2D2A;text-shadow:0px 1px 0px #000;-moz-transition:all 0.3s ease;-webkit-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;font-weight:bold;outline:none;text-decoration:none;}  
  .zp-links a:hover{color:#FFB32E;padding-left:14px;background:rgba(0,0,0,0.2)}  
  .zp-links a.w-sub{background:url('/images/menu_vot/submenu-btn.png') no-repeat;background-position:180px 7px}  
  .zp-links a.w-sub:hover{background:url('/images/menu_vot/submenu-btn.png') no-repeat rgba(0,0,0,0.2);background-position:185px 7px}  
  .zp-links .s-level a.w-sub{font-weight:bold;background-position:182px 7px}  
  .zp-links .s-level a.w-sub:hover{background-position:190px 7px}  
  .zp-links .s-level{padding-left:22px; background:url('/images/menu_vot/123-08.png');}  
  .zp-links .s-level a{border-left:2px solid #272727;font-weight:normal}  
  .zp-links .s-level a:hover{padding-left:8px;margin-left:-8px}

3.Идем в первый контенер, и кидаем код:
Код
<div class="side-navigation">  
   
  <div class="block-inner">  
  <div class="zp-links">  
  <a title="Главная" href="http://zornet.ru/">Главная</a>  
  <a title="Форум игрока" href="http://zornet.ru/forum/">На форум</a>  
  <a title="Новости" href="http://zornet.ru/news/">Новости</a>  
  <a title="Музыка" href="http://zornet.ru/blog/">Музыка</a>  
  <a title="Статьи" href="http://zornet.ru/publ/">Статьи</a>  
  <a title="ФотоZал" href="/photo/" >ФотоZал</a>  
  <a title="КиноZал" href="/stuff/" >Wot menu</a>  
  <a title="Обзор Игр" href="/board" >Wot menu</a>  
  <a title="Файловый архив" href="/load" >Файловый архив</a>  
  <a title="Мониторинг серверов" href="/dir" >Мониторинг серверов</a>  
  <a rel="soft-menu" class="w-sub" href="javascript://">uCoz</a>  
  <div class="s-level" id="soft-menu" style="display: none">  
  <a title="Шаблоны для Ucoz" href="/load/13" >Шаблоны</a>  
  <a title="Скрипты для Ucoz" href="/load/14" >Скрипты</a>  
  <a title="Шапки для Ucoz" href="/load/15" >Шапки</a>  
  <a title="Смайлы и Иконки для Ucoz" href="/load/16" >Смайлы и Иконки</a>  
  <a title="PSD Баннера 468x60 и 88x31" href="/load/47" >PSD Баннера</a>  
  <a title="Часы для Ucoz" href="/load/48" >Часы</a>  
  <a title="Иконки групп для Ucoz" href="/load/50" >Иконки групп </a>  

  </div>  
  <a rel="games-menu" class="w-sub" href="javascript://">Шкурки для wot</a>  
  <div class="s-level" id="games-menu" style="display: none">  
  <a title="Консольные команды для Counter strike 1.6" href="/load/19" >Зимние</a></a>  
  <a title="Готовые Сервера для Counter strike 1.6" href="/load/20" >Летние </a>  
  <a title="Модели Игроков для Counter strike 1.6" href="/load/21" >Модели Игроков </a>  
  <a title="Модели Оружия для Counter strike 1.6" href="/load/22" >Модели Оружия</a>  
  <a title="Анти-читы для Counter strike 1.6" href="/load/23" >Анти-читы </a>  
  <a title="Плагины для Counter strike 1.6" href="/load/24" >Плагины </a>  
  <a title="Карты для Counter strike 1.6" href="/load/25" >Карты </a>  
  <a title="Читы для Counter strike 1.6" href="/load/26" >Читы </a>  
  <a title="Боты для Counter strike 1.6" href="/load/44" >Боты</a>  
  <a title="Звуки для Counter strike 1.6" href="/load/45" >Звуки</a>  
  <a title="Моды для Counter strike 1.6" href="/load/46" >Моды</a>  
  <a title="Config.cfg Конфиги для Counter strike 1.6" href="/load/51" >Config.cfg Конфиги</a>  
  </div>  
  <a rel="kino-menu" class="w-sub" href="javascript://">Counter-Strike: Source</a>  
  <div class="s-level" id="kino-menu" style="display: none">  
  <a title="Скачать Counter-Strike:Source" href="/load/29">Counter-Strike:Source</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/30">Программы</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/32">Плагины</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/33">Античиты</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/34">Карты</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/35">Модели игроков</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/36">Модели оружия</a>  
  <a title="Скачать Counter-Strike:Source" href="/load/56">Готовые сервера</a>  
  </div>  

  <a rel="pers-menu" class="w-sub" href="javascript://">MINECRAFT</a>  
  <div class="s-level" id="pers-menu" style="display: none">  
  <a title="Моды для minecraft" href="/load/38">Моды</a>  
  <a title="Клиенты для minecraft" href="/load/39">Клиенты</a>  
  <a title="Текстуры для minecraft" href="/load/42">Текстуры</a>  
  <a title="Карты для minecraft" href="/load/43">Карты</a>  
  <a title="Софт для minecraft" href="/load/40">Софт</a>  
  <a title="Разное для minecraft" href="/load/41">Разное</a>  

  </div>  

  </div>  

  </div>  
  </div>  
  <script type="text/javascript">  
  $(function(){  
  $(".s-level").hide();  
  $(".zp-links a.w-sub").click(function(){  
  var submenu = $(this).attr('rel');  
  $("#"+submenu+"").toggle('fast');  
  });  
  });  
  </script>  

  <script type="text/javascript" src="/images/menu_vot/m_color.js"></script>

Шаблон World of tanks переделанный и доработанный вы можете скачать на нашем сайте.
11 Марта 2013 Загрузок: 46 Просмотров: 5537 Комментариев: (19)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 17
Диона
Диона 01 Марта 2014 18:301
0
Помогите пожалуйста. Поставила данное меню. Но мне маловато раздвижных пунктов, как можно их увеличить?
Kosten
Kosten 01 Марта 2014 20:592
0
Увеличить в габаритах или в разделах?
Диона
Диона 02 Марта 2014 10:413
0
Не, это не то. Это я и сама умею делать. Мне нужны дополнительные блоки с подменю. Их в этом меню 4 а мне надо еще бы три. Вот я нажимаю например на название в меню и оно открывается и там несколько подпунктов. Вот что мне надо. Как это сделать?
Диона
Диона 02 Марта 2014 13:374
0
Вот спасибо сейчас попробую.
Диона
Диона 02 Марта 2014 13:445
0
Ой, спасибо получилось. Вот еще маленький вопросик я не найду где удалить несуществующую картинку у меня там просто квадратик а здесь стрелочки и у меня их нет.
๖ۣۜInspire
๖ۣۜInspire 02 Марта 2014 13:506
0
нужно скачать архив и залить его содержимое в папку /images/menu_vot/, в архиве эта стрелочка есть и она называтся submenu-btn.png
ну а если она совсем не нужна то найдите вот это
Код
.zp-links a.w-sub{background:url('/images/menu_vot/submenu-btn.png') no-repeat;background-position:180px 7px}
.zp-links a.w-sub:hover{background:url('/images/menu_vot/submenu-btn.png') no-repeat rgba(0,0,0,0.2);background-position:185px 7px}
и замените на это
.zp-links a.w-sub{background-position:180px 7px}
.zp-links a.w-sub:hover{background-position:185px 7px}
Диона
Диона 02 Марта 2014 14:137
0
Огромное спасибо. Справилась со всеми проблемами. Аж два лишних блока поставила раздвижных. СПАСИБО!!!!
1 2 3 »
avatar