Установка: верхнюю часть сайта в любое место:
Код
<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; }