ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Прозрачное и стильное темное меню uCoz

Прозрачное и стильное темное меню uCoz

Изначально это навигация было на одну популярную игру, то теперь стала Прозрачное по стилю и темное меню uCoz только для ресурсов с оригинальным дизайном. Оттенок цвета безусловно у него есть, это черный, который на любом фоне будет отлично видно, что он не полностью закрашен. Здесь если у вас ресурс реально не похожий на другой, то вы можете с этого скрипте сделать неплохое меню, которое будет отвечать за основные функций или просто поставить его для разделов. Но как понимаете, нужен цвет на котором оно будет стоять, скажем, если делать светлый, то нужно в стилях изменять оттенок название. Хочу заметить, что у него есть красивый эффект при наведение, это не просто меняется. А плавно переходит с низу на верх еще одна плашка раздела, что можете посмотреть в демонстраций и понят как и что на самом деле.

Код:

Код

<div class="block-center">
  <ul class="v-menu">

  <li><a href="http://zornet.ru/">Моды для Майнкрафт</a></li>
  <li><a href="/">Плагины для Майнкрафт</a></li>
  <li><a href="/">Сайт ZORNET.RU</a></li>
  <li><a href="/">Текстуры для Майнкрафт</a></li>
  <li><a href="/">Ресурс паки для Майнкрафт</a></li>
  <li><a href="/">Программы для Майнкрафт</a></li>
  <li><a href="/">Русификаторы для Майнкрафт</a></li>
  <li><a href="/">Сервера для Майнкрафт</a></li>
  <li><a href="/">Читы для Майнкрафт</a></li>
  <li><a href="/">Скины для Майнкрафт</a></li>
  <li><a href="/">Клиенты для Майнкрафт</a></li>
  <li><a href="/">Шейдеры для Майнкрафт</a></li>
  </ul>
  </div>

CSS:

Код

.block-center {
  width:240px;
  margin-left:9px;
  margin-bottom:15px;
  float:left;
}

.v-menu li {
  width:235px;
  float:left;
  margin-bottom:3px;
  text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.45);
  padding:5px 0px 5px 5px;
  background:url(http://zornet.ru/SKRIPT/ZR/granve/v-menu.png) top left repeat-x;
  -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
-moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.v-menu li:hover {
background:url(http://zornet.ru/SKRIPT/ZR/granve/v-menu.png) bottom left repeat-x;
}
.v-menu li a {
  text-decoration:none;
  color:#e8dbc9;
}
.v-menu li:hover a {
  text-decoration:underline;
}

24 Июня 2015 Просмотров: 1002 Комментариев: (0)

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

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

Kosten

Комментарии: 0