| Priboy | Дата: Пятница, 22.06.2012, 13:37 | Сообщение # 1 |
 Генералиссимус
Группа: Администраторы
Сообщений: 142
Награды: 1
Репутация: 953
Статус:  | 
Качаем архив и распаковываем в корень сайта.
Этот код ставим в самый верх сайта:
[green]<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="menu.css" type="text/css" media="screen" />
<title>Мега панель с выпадающими пунктами</title>
<!--[if IE 6]>
<style>
body {behavior: url("csshover3.htc");}
#menu li .drop {background:url("img/drop.gif") no-repeat right 8px;
</style>
<![endif]-->
</head>
<body>
<ul id="menu">
<li><a href="#" class="drop">Паспорт</a><!-- Начало пункта Паспорт -->
<div class="dropdown_2columns"><!-- Начало контейнера профиль -->
<div class="col_2">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="17" background="/border/0-1.png" height="17">
</td>
<td background="/border/0-2.png" height="17">
</td>
<td width="17" background="/border/0-3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="/border/0-4.png">
</td>
<td style="padding:20px;">
<DIV align="center"><script language="JavaScript">
function process(){}
today = new Date()
if((today.getHours() < 12) && (today.getHours() >= 6))
{ document.write("<b>Доброе утро, $USERNAME$.</b>")}
if((today.getHours() >= 12) && (today.getHours() < 18))
{ document.write("<b>Добрый день, $USERNAME$.</b>")}
if((today.getHours() >= 18) && (today.getHours() <= 23))
{ document.write("<b>Добрый вечер, $USERNAME$.</b>")}
if((today.getHours() >= 0) && (today.getHours() < 4))
{ document.write("<b>Доброй ночи, $USERNAME$</b>")}
if((today.getHours() >= 4) && (today.getHours() <= 6))
{ document.write("<b>Не спиться? $USERNAME$</b>")}
</script>
<?if($USER_AVATAR_URL$)?><img class="userAvatar" title="$USERNAME$" src="$USER_AVATAR_URL$" border="0"><?else?><?if($USER_LOGGED_IN$)?><img class="userAvatar" title="$USERNAME$" src="/img/891194400.png" border="0"><?else?><img class="userAvatar" title="$USERNAME$" src="/img/744843989.jpg" border="0"><?endif?><?endif?><br>
<?if($USER_LOGGED_IN$)?>
<?endif?>
<center>
<script language="JavaScript">
now = new Date()
if (now.getDay() == 0)
document.write("Отдыхайте, завтра рабочий день...")
if (now.getDay() == 1)
document.write("Сегодня понедельник - настраивайтесь на работу")
if (now.getDay() == 2)
document.write("Уже вторник, понедельник к счастью позади!")
if (now.getDay() == 3)
document.write("Половина недели позади - сегодня уже среда")
if (now.getDay() == 4)
document.write("Сегодня четверг, скоро выходные...")
if (now.getDay() == 5)
document.write("Сегодня пятница - Ура, седня последний день!")
if (now.getDay() == 6)
document.write("Сегодня суббота - выходной день!")
</script>
<div align="left">
<li>
<a style="color: black;">
<img src="$HOME_PAGE_LINK$/img/user/time.png">
Ты здесь:
<font color="#FF0000">
<b>$USER_REG_DAYS$</b>
</font>
-й день
</a>
</li>
<li>
<a href="$PERSONAL_PAGE_LINK$" rel="nofollow" onclick="window.open('$PERSONAL_PAGE_LINK$','up1','scrollbars=1,top=0,left=0,resizable=1,width=680,height=350');return false;">
<img src="$HOME_PAGE_LINK$/img/user/user2.png" border="0" alt="">
Мой профиль
</a>
</li>
<li>
<a href="javascript://" onclick="window.open('$HOME_PAGE_LINK$/index/11','edit','scrollbars=1,top=0,left=0,resizable=1,width=680,height=350');return false;">
<img src="$HOME_PAGE_LINK$/img/user/setting.png">
Ред. информацию
</a>
</li>
<li>
<a href="javascript://" onclick="window.open('$HOME_PAGE_LINK$/index/14-0-0-1','send','scrollbars=1,top=0,left=0,resizable=1,width=680,height=350');return false;">
<img src="$HOME_PAGE_LINK$/img/user/send.png">
Отправить ЛС
</a>
</li>
<li>
<a href="javascript://" onclick="window.open('$HOME_PAGE_LINK$/index/14','mail','scrollbars=1,top=0,left=0,resizable=1,width=680,height=350');return false;">
<img src="$HOME_PAGE_LINK$/img/user/gmail.png">
Читать ЛС (
<b>0</b>
)
</a>
</li>
</div>
<div class="col_0">
<center>
<a href="javascript://" title="Выход" onclick="if (confirm('Вы действительно хотите выйти?')) {alert('Счастливого пути Вам! Приходите еще! :))');location.href='$HOME_PAGE_LINK$/index/10';} else {alert('Спасибо, что остались! :)).')};">
<img src="/img/exit.gif" alt="Выход" border="0">
</a>
</center>
</div>
</td>
<td width="17" background="/border/0-8.png">
</td>
</tr>
<tr>
<td width="17" background="/border/0-7.png" height="17">
</td>
<td background="/border/0-6.png" height="17">
</td>
<td width="17" background="/border/0-5.png" height="17">
</td>
</tr>
</tbody>
</table>
<!-- Конец контейнера профиль -->
</li><!-- Конец пунтка паспорт -->
<li><a href="#" class="drop">Статистика сайта </a><!-- Начало пунтка статистика-->
<div class="dropdown_2columns"><!-- Начало контейнера статистика -->
<div class="col_2">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="17" background="/border/0-1.png" height="17">
</td>
<td background="/border/0-2.png" height="17">
</td>
<td width="17" background="/border/0-3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="/border/0-4.png">
</td>
<td style="padding:20px;">
<center>
<div class="tOnline" id="onl1">$ONLINE_COUNTER$
$ONLINE_USERS_LIST$ </center>
<br> <center> <a onclick="$('#stat').slideToggle('slow');" href="javascript://"><p class="black_box">Подробнее</p></a> </center>
<div id="stat" style="display: none"><center><b>Сегодня были</b><center/>$MYINF_2$ <a href="javascript://" rel="nofollow" onclick="new _uWnd('TdUsrLst',' ',250,200,{autosize:0},{url:'/index/62-2'});return false;" class="fUsrList"><br><p class="black_box">Полный список</p></a><hr>$MYINF_1$</div>
</div>
</td>
<td width="17" background="/border/0-8.png">
</td>
</tr>
<tr>
<td width="17" background="/border/0-7.png" height="17">
</td>
<td background="/border/0-6.png" height="17">
</td>
<td width="17" background="/border/0-5.png" height="17">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Конец пунтка статистика-->
<!-- Конец контейнера статистика-->
<li><a href="#" class="drop">Мини чат </a><!-- Начало пунтка чат-->
<div class="dropdown_2columns"><!-- Начало контейнера чат -->
<div class="col_2">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="17" background="/border/0-1.png" height="17">
</td>
<td background="/border/0-2.png" height="17">
</td>
<td width="17" background="/border/0-3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="/border/0-4.png">
</td>
<td style="padding:20px;">
<div align="center">
<a href="javascript://" onclick="new _uWnd('name','Мини чат',800,600,{autosize: 1,modal: 1,align:'center'},$('#mformDiv').html());return false;"><img border="0" src="/img/chat.png" title="Открыть Чат в ajax окне"></a><div id="mformDiv" style="display:none;"><div id="chat">
<?if($ONLINE_USERS_LIST$)?>
<center>
<span id="needtorefresh"><span title="Сейчас онлайн" id="needtorefresh2">
$ONLINE_USERS_LIST$
</span></span>
<br><br>
</center>
<?endif?>
<center>
$CHAT_BOX$
<br>
</center></div>
</div>
<div class="col_">
<br> <center><p class="black_box">Правила мини чата</p> </center>
<p>Чат создан исключительно для общения!
<p>Запрещается:
<p>- Оставлять отзывы о сайте.
<p>- Спамить.
<p>- Просить администрацию о чем-либо.(Есть обратная связь)
<p>- Критиковать действия администрации сайта.
<p>- Оскорблять других участников.
<p>В остальном в соответствии с общими правилами сайта.
</p>
</div>
</td>
<td width="17" background="/border/0-8.png">
</td>
</tr>
<tr>
<td width="17" background="/border/0-7.png" height="17">
</td>
<td background="/border/0-6.png" height="17">
</td>
<td width="17" background="/border/0-5.png" height="17">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Конец пунтка чат-->
<!-- Конец контейнера чат-->
<li><a href="#" class="drop">Реклама</a><!-- Начало пунтка реклама -->
<div class="dropdown_4columns"><!-- Начало контейнера реклама -->
<div class="col_4">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="17" background="/border/0-1.png" height="17">
</td>
<td background="/border/0-2.png" height="17">
</td>
<td width="17" background="/border/0-3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="/border/0-4.png">
</td>
<td style="padding:20px;">
<style type="text/css">
.sSample {text-align:center;padding:3px;border:1px solid #000000;margin:5px;cursor:pointer;font-size:7pt;}
.sSampleO {text-align:center;padding:3px;border:1px solid #BEBEBE;margin:5px;cursor:pointer;background:
</style>
<div class="sSample" onmouseover="this.className='sSampleO'" onmouseout="this.className='sSample'" onclick="window.open('http://Сайт');"><img src="/img/reklama-.png" border="1"><br>Занять место</div>
<div class="sSample" onmouseover="this.className='sSampleO'" onmouseout="this.className='sSample'" onclick="window.open('http://Сайт');"><img src="/img/reklama-.png" border="1"><br>Занять место</div>
<div class="sSample" onmouseover="this.className='sSampleO'" onmouseout="this.className='sSample'" onclick="window.open('http://Сайт');"><img src="/img/reklama-.png" border="1"><br>Занять место</div>
<div class="sSample" onmouseover="this.className='sSampleO'" onmouseout="this.className='sSample'" onclick="window.open('http://Сайт');"><img src="/img/reklama-.png" border="1"><br>Занять место</div>
</td>
<td width="17" background="/border/0-8.png">
</td>
</tr>
<tr>
<td width="17" background="/border/0-7.png" height="17">
</td>
<td background="/border/0-6.png" height="17">
</td>
<td width="17" background="/border/0-5.png" height="17">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- Конец контейнера рекламма -->
<!-- Конец пункта на реклама -->
<li class="menu_right"><a href="#" class="drop">Меню</a><!-- Начало пункта меню -->
<div class="dropdown_3columns align_right"><!-- Начало контейнера меню-->
<div class="col_3">
</div>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td width="17" background="/border/0-1.png" height="17">
</td>
<td background="/border/0-2.png" height="17">
</td>
<td width="17" background="/border/0-3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="/border/0-4.png">
</td>
<td style="padding:20px;">
<div class="col_1">
<ul class="greybox">
<li><a href="#"><img src="/img/menu/kfm_home.png" border="0" alt="" />Главная</a></li>
<li><a href="#"><img src="/img/menu/agt_forum.png" border="0" alt="" />Форум</a></li>
<li><a href="#"><img src="/img/menu/news.png" border="0" alt="" />Новости</a></li>
<li><a href="#"><img src="/img/menu/picture.png" border="0" alt="" />Картинки</a></li>
</ul>
</div>
<div class="col_1">
<ul class="greybox">
<li><img src="/img/menu/files.png" border="0" alt="" /><b>Каталог файлов</b></li>
<li><a href="#"><img src="/img/menu/progs.png" border="0" alt="" />Программы </a></li>
<li><a href="#"><img src="/img/menu/games.png" border="0" alt="" />Игры </a></li>
<li><a href="#"><img src="/img/menu/video.png" border="0" alt="" />Видео</a></li>
</ul>
</div>
<div class="col_1">
<ul class="greybox">
<li><img src="/img/menu/584845062582610568.png" border="0" alt="" /><b>Фотошоп</b></li>
<li><a href="#"><img src="/img/menu/image-x-psd.png" border="0" alt="" />PSD</a></li>
<li><a href="#"><img src="/img/menu/edit-clear.png" border="0" alt="" />Кисти </a></li>
<li><a href="#"><img src="/img/menu/stylesheet.png" border="0" alt="" />Стили</a></li>
<li><a href="#"><img src="/img/menu/stock_example.png" border="0" alt="" />Уроки</a></li>
<li><a href="#"><img src="/img/menu/gradients.png" border="0" alt="" />Градиенты</a></li>
<li><a href="#"><img src="/img/menu/plugins.png" border="0" alt="" />Плагины</a></li>
</ul>
</div>
<div class="col_1">
<ul class="greybox">
<li><img src="/img/menu/uifw.png" border="0" alt="" /><b>Всё для ucoz</b></li>
<li><a href="#"><img src="/img/menu/scripts_code.png" border="0" alt="" />Скрипты </a></li>
<li><a href="#"><img src="/img/menu/gimp.png" border="0" alt="" />Шаблоны</a></li>
<li><a href="#"><img src="/img/menu/redhat-sound_video.png" border="0" alt="" />Видео уроки</a></li>
<li><a href="#"><img src="/img/menu/stop1pressedblue.png" border="0" alt="" />Кнопки</a></li>
<li><a href="#"><img src="/img/menu/gnome-fs-loading-icon.png" border="0" alt="" />Иконки</a></li>
<li><a href="#"><img src="/img/menu/hat.png" border="0" alt="" />Шапки</a></li>
</ul>
</div>
</td>
<td width="17" background="/border/0-8.png">
</td>
</tr>
<tr>
<td width="17" background="/border/0-7.png" height="17">
</td>
<td background="/border/0-6.png" height="17">
</td>
<td width="17" background="/border/0-5.png" height="17">
</td>
</tr>
</tbody>
</table>
</div><!-- Конец контейнера меню -->
<!-- Конец пункта меню меню -->
</ul>
[/green]
Это в css:
[green]#menu {
list-style:none;
width:1200px;
margin:5px auto 0px auto;
height:43px;
padding:0px 20px 0px 20px;
/* Скругленные углы */
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/* Цвет фона и градиенты */
background: #014464;
background: -moz-linear-gradient(top, #ffffff, #013953);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953));
/* Границы */
border: 1px solid #002232;
-moz-box-shadow:inset 0px 0px 1px #edf9ff;
-webkit-box-shadow:inset 0px 0px 1px #edf9ff;
box-shadow:inset 0px 0px 1px #edf9ff;
}
#menu li {
float:left;
display:block;
text-align:center;
position:relative;
padding: 4px 10px 4px 10px;
margin-right:30px;
margin-top:7px;
border:none;
}
#menu li:hover {
border: 1px solid #777777;
padding: 4px 9px 4px 9px;
/* Цвет фона и градиенты */
background: #F4F4F4;
background: -moz-linear-gradient(top, #F4F4F4, #EEEEEE);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F4F4), to(#EEEEEE));
/* Скругленные углы */
-moz-border-radius: 5px 5px 0px 0px;
-webkit-border-radius: 5px 5px 0px 0px;
border-radius: 5px 5px 0px 0px;
}
#menu li a {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color: #EEEEEE;
display:block;
outline:0;
text-decoration:none;
text-shadow: 1px 1px 1px #000;
}
#menu li:hover a {
color:#161616;
text-shadow: 1px 1px 1px #ffffff;
}
#menu li .drop {
padding-right:21px;
background:url("/img/drop.png") no-repeat right 8px;
}
.dropdown_1column,
.dropdown_2columns,
.dropdown_3columns,
.dropdown_4columns,
.dropdown_5columns {
margin:4px auto;
float:left;
position:absolute;
left:-999em; /* Скрываем выпадающие пункты */
text-align:left;
padding:10px 5px 10px 5px;
border:1px solid #777777;
border-top:none;
/* Фон с градиентом */
background:#F4F4F4;
background: -moz-linear-gradient(top, #EEEEEE, #BBBBBB);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB));
/* Скругленные углы */
-moz-border-radius: 0px 5px 5px 5px;
-webkit-border-radius: 0px 5px 5px 5px;
border-radius: 0px 5px 5px 5px;
}
.dropdown_1column {width: 140px;}
.dropdown_2columns {width: 270px;}
.dropdown_3columns {width: 650px;}
.dropdown_4columns {width: 600px;}
.dropdown_5columns {width: 700px;}
#menu li:hover .dropdown_1column,
#menu li:hover .dropdown_2columns,
#menu li:hover .dropdown_3columns,
#menu li:hover .dropdown_4columns,
#menu li:hover .dropdown_5columns {
left:-1px;
top:auto;
}
.col_0,
.col_1,
.col_2,
.col_3,
.col_4,
.col_5
{
display:inline;
float: left;
position: relative;
margin-left: 5px;
margin-right: 5px;
}
.col_0 {width:180px;}
.col_1 {width:130px;}
.col_2 {width:260px;}
.col_3 {width:650px;}
.col_4 {width:590px;}
.col_5 {width:690px;}
#menu .menu_right {
float:right;
margin-right:0px;
}
#menu li .align_right {
/* Скругленные углы */
-moz-border-radius: 5px 0px 5px 5px;
-webkit-border-radius: 5px 0px 5px 5px;
border-radius: 5px 0px 5px 5px;
}
#menu li:hover .align_right {
left:auto;
right:-1px;
top:auto;
}
#menu p, #menu h2, #menu h3, #menu ul li {
font-family:Arial, Helvetica, sans-serif;
line-height:21px;
font-size:13px;
text-align:left;
text-shadow: 1px 1px 1px #FFFFFF;
}
#menu h2 {
font-size:21px;
font-weight:400;
letter-spacing:-1px;
margin:7px 0 14px 0;
padding-bottom:14px;
border-bottom:1px solid #666666;
}
#menu h3 {
font-size:14px;
margin:7px 0 14px 0;
padding-bottom:7px;
border-bottom:1px solid #888888;
}
#menu p {
line-height:18px;
margin:0 0 10px 0;
}
#menu li:hover div a {
font-size:12px;
color:#015b86;
}
#menu li:hover div a:hover {
color:#029feb;
}
.strong {
font-weight:bold;
}
.italic {
font-style:italic;
}
.imgshadow { /* Лучший стиль для легкого фона */
background:#FFFFFF;
padding:4px;
border:1px solid #777777;
margin-top:5px;
-moz-box-shadow:0px 0px 5px #666666;
-webkit-box-shadow:0px 0px 5px #666666;
box-shadow:0px 0px 5px #666666;
}
.img_left { /* Изображения прижимаются влево */
width:auto;
float:left;
margin:5px 15px 5px 5px;
}
#menu li .black_box {
background-color:#333333;
color: #eeeeee;
text-shadow: 1px 1px 1px #000;
padding:4px 6px 4px 6px;
/* Скругленные углы */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
/* Тень */
-webkit-box-shadow:inset 0 0 3px #000000;
-moz-box-shadow:inset 0 0 3px #000000;
box-shadow:inset 0 0 3px #000000;
}
#menu li ul {
list-style:none;
padding:0;
margin:0 0 12px 0;
}
#menu li ul li {
font-size:12px;
line-height:24px;
position:relative;
text-shadow: 1px 1px 1px #ffffff;
padding:0;
margin:0;
float:none;
text-align:left;
width:130px;
}
#menu li ul li:hover {
background:none;
border:none;
padding:0;
margin:0;
}
#menu li .greybox li {
background:#F4F4F4;
border:1px solid #bbbbbb;
margin:0px 0px 4px 0px;
padding:4px 6px 4px 6px;
width:116px;
/* Скругленные углы */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}
#menu li .greybox li:hover {
background:#ffffff;
border:1px solid #aaaaaa;
padding:4px 6px 4px 6px;
margin:0px 0px 4px 0px;
}
img {
border:medium none;
}
[/green]
[green]СКАЧАТЬ[/green]
|
| |
|
|
