Навигационное меню как на AP-PRO - Форум



[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Web Раздел » Скрипты сталкер » Навигационное меню как на AP-PRO
Навигационное меню как на AP-PRO
XemorDioДата: Пн, 03.08.2015, 21:42 | Сообщение # 1




Сообщений: 38
Награды: 1
Репутация: 6

Статус:

Установка: верхнюю часть сайта в любое место:
Код
<div id="ap-menu_v"></div>
<div class="b-menu">
<ul>
         
<li class="ap-menu_p" style="visibility: visible;">
<a href="/" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 15px;">ГЛАВНАЯ</span></a>     
</li>
         
<li class="ap-menu_p" style="visibility: visible;">
<a href="/forum" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 60px;">ФОРУМ</span></a>     
         
         
</li>
         
         
         
<li class="ap-menu_p" style="visibility: visible;">
<a href="/publ" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 15px;">СТАТЬИ</span></a>     
</li>     
         
<li class="ap-menu_p" style="visibility: visible;">
<a href="/stuff" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 40px;">МОДЫ</span></a>     

<div class="ap-menu_on ap-menu_dp"><ul>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/stuff/ten_chernobylja/1"><span class="ap-menu_dp_tx">Тень Чернобыля</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/stuff/chistoe_nebo/2"><span class="ap-menu_dp_tx">Чистое небо</span></a>
</li>

<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/stuff/zov_pripjati/3"><span class="ap-menu_dp_tx">Зов Припяти</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/stuff/ce/4"><span class="ap-menu_dp_tx">Cry Engine</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/stuff/drugie_platformy/5"><span class="ap-menu_dp_tx">Другие</span></a>
</li>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/index/stalker_top_mod_all/0-144"><span class="ap-menu_dp_tx">TOP</span></a>
</li>     
         
</ul></div>
</li>
         

<li class="ap-menu_p" style="visibility: visible;">
<a href="/blog" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 15px;">БЛОГ</span></a>     
</li>     
         

         
<li class="ap-menu_p" style="visibility: visible;">
<a class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 20px;">СЕРВИСЫ САЙТА</span></a>     

<div class="ap-menu_on ap-menu_dp"><ul>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/news"><span class="ap-menu_dp_tx">Новости</span></a>
</li>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/blog/katalog_obzorov_ot_ap_pro/2014-10-03-770"><span class="ap-menu_dp_tx">Каталог обзоров</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/blog/kalendar_relizov/2013-02-11-454"><span class="ap-menu_dp_tx">Календарь релизов</span></a>
</li>

<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/blog/golosovanie_mod_mesjaca/2014-04-24-674"><span class="ap-menu_dp_tx">Мод месяца</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/blog/10_modov_v_kotorye_stoit_poigrat/2013-05-23-493"><span class="ap-menu_dp_tx">Наш выбор</span></a>
</li>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/blog/kalendar_stalkera/2014-10-04-771"><span class="ap-menu_dp_tx">Календарь Сталкера </span></a>
</li>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/index/top/0-99"><span class="ap-menu_dp_tx">Популярное</span></a>
</li>     
         
</ul></div>
</li>     

<li class="ap-menu_p" style="visibility: visible;">
<a href="/load/" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 20px;">ФАЙЛЫ</span></a>     

<div class="ap-menu_on ap-menu_dp"><ul>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/load/teni_chernobylja/7"><span class="ap-menu_dp_tx">ТЧ</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/load/chistoe_nebo/11"><span class="ap-menu_dp_tx">ЧН</span></a>
</li>

<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/load/zov_pipjati/15"><span class="ap-menu_dp_tx">ЗП</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/load/book/20"><span class="ap-menu_dp_tx">Книги</span></a>
</li>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/load/raznoe/19"><span class="ap-menu_dp_tx">Другое</span></a>
</li>     
         
</ul></div>
</li>     
         
<li class="ap-menu_p" style="visibility: visible;">
<a href="javascript://" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 35px;">ЕЩЕ</span></a>     

<div class="ap-menu_on ap-menu_dp"><ul>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/dir"><span class="ap-menu_dp_tx">ТОП сайтов</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/photo"><span class="ap-menu_dp_tx">Галерея</span></a>
</li>

<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/video"><span class="ap-menu_dp_tx">Видео</span></a>
</li>
         
     <li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/forum/5-10843-1"><span class="ap-menu_dp_tx">Ваш контент</span></a>
</li>
         
     <li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/forum/5-296-1"><span class="ap-menu_dp_tx">Вакансии</span></a>
</li>
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" href="/index/ap_production_team/0-47"><span class="ap-menu_dp_tx">О нас</span></a>
</li>     
         
</ul></div>
</li>     
         
<li class="ap-menu_p" style="visibility: visible;">
<a href="javascript://" class="ap-menu_l"><span class="ap-menu_tx" style="padding: 0 20px;">Спецпроекты</span></a>     

<div class="ap-menu_on ap-menu_dp"><ul>
         
     <noindex><li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" rel="nofollow" target="_blank" href="//youtube.com/user/TheWolfstalker"><span class="ap-menu_dp_tx">Youtube 1</span></a>
</li></noindex>
         
     <noindex><li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" rel="nofollow" target="_blank" href="//youtube.com/user/TheWolfstalker2"><span class="ap-menu_dp_tx">Youtube 2</span></a>
</li></noindex>
         
<noindex><li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" rel="nofollow" target="_blank" href="//vk.com/approduction"><span class="ap-menu_dp_tx">Группа Вконткте</span></a>
</li></noindex>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" target="_blank" href="//kino.ap-pro.ru/"><span class="ap-menu_dp_tx">Stalker-Film</span></a>
</li>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" target="_blank" href="//lost-alpha.com/"><span class="ap-menu_dp_tx">Lost Alpha Fan Site</span></a>
</li>     
         
<noindex><li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" rel="nofollow" target="_blank" href="//vk.com/gscgame"><span class="ap-menu_dp_tx">STALKER-2 News</span></a>
</li></noindex>     
         
<noindex><li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" rel="nofollow" target="_blank" href="//vk.com/projects_ap"><span class="ap-menu_dp_tx">Left to Die - News</span></a>
</li></noindex>     
         
<li class="ap-menu_dp_p">
<a class="ap-menu_dp_l" target="_blank" href="/index/twitter/0-136"><span class="ap-menu_dp_tx">Твиттер</span></a>
</li>     
         
</ul></div>
</li>     
         
</ul>
</div>


Это вставляем в ксс:
Код
/* Меню */
.ap-menu_p:hover .ap-menu_on{display: inline;}     

.b-menu {
     height: 39px;
     margin-top: -52px;
     padding-bottom: 9px;
     padding-left: 25px;
     position: relative;
     z-index: 600;
}
.ap-menu_p{
background: url("http://i.imgur.com/pPzxz0f.jpg") no-repeat scroll rgba(0, 0, 0, 0);
float: left;
position: relative;
visibility: hidden;
}

.ap-menu_p:hover .ap-menu_tx {background-position: left 0;}
         
@font-face{
font-family:'WarHeliosCondC';
font-style: normal;
font-weight: normal;
src: url("/css/warhelioscondc-webfont.eot?#iefix") format("embedded-opentype"), url("http://passagestalker.3dn.ru/design/warhelioscondc-webfont.woff") format("woff");     
}

.ap-menu_l {
     color: #d2d9d9;
     float: right;
     font-family: "WarHeliosCondC","Arial Narrow",Arial,sans-serif;
     font-size: 17px;
     font-stretch: condensed;
     height: 39px;
     line-height: 39px;
     padding: 0 0 0 1px;
     text-shadow: 1px -1px 0 #000000;
     text-transform: uppercase;
}

.ap-menu_tx {
     background: url("http://i.imgur.com/NP0HCMN.jpg") repeat-x scroll left 3000px rgba(0, 0, 0, 0);
     cursor: pointer;
     float: left;
     padding: 0 5px;
     white-space: nowrap;
}

.ap-menu_dp {
     background: #181717;
     border-color: #000 #000;
     border-image: none;
     border-style: none solid solid;
     border-width: medium 1px 1px;
     box-shadow: 0 15px 20px #000;
     left: -1px;
     min-width: 100%;
     position: absolute;
     right: -2px;
     top: 100%;
     z-index: 999;
}
.ap-menu_dp_p {
     background: url("http://i.imgur.com/0g7cbun.gif") no-repeat scroll left 3000px rgba(0, 0, 0, 0);
     border-color: #303030 #303030 #0d0d0d;
     border-style: solid;
     border-width: 1px;
}
.ap-menu_dp_p:last-child {
     border-bottom: 1px solid #303030;
}
.ap-menu_dp_p:hover {
     background-position: left top;
     background-repeat: repeat;
     border-color: #2c4b48 #2c4b48 #2c4b48;
     border-style: solid;
     border-width: 1px;
}
.ap-menu_dp_l {
     color: #919191;
     display: block;
     font-size: 13px;
     height: 30px;
     line-height: 30px;
     padding: 0;
     text-decoration: none;
     white-space: nowrap;
     width: 100%;
}
.ap-menu_dp_l:hover {color: #fff;text-decoration: none;}
.ap-menu_dp_tx {padding: 0 8px;}
a .ap-menu_dp_tx {cursor: pointer;}
.ap-menu_on {display: none;}
#ap-menu_v{background:url('http://i.imgur.com/562tLq8.jpg'); height: 65px; }



$
Форум » Web Раздел » Скрипты сталкер » Навигационное меню как на AP-PRO
Страница 1 из 11
Поиск:

Войти Зарегистрироваться