Главная » Cкрипты для uCoz » Cупер крутая панель

Cупер крутая панель

  


ставим в верх сайта предварительно скачав архив
Code
<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>


А это в css

Code
body, ul, li {  
  font-size:14px;  
  font-family:Arial, Helvetica, sans-serif;  
  line-height:21px;  
  text-align:left;  
  }  

  #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;  
  }
Cупер крутая панель - Cкрипты для uCoz - Каталог файлов - Все для uCoz, DLE, Joomla, скрипты для uCoz
Z Скачать Cупер крутая панель

в верху, панель, меню, сайта
Категория: Cкрипты для uCoz Просмотров: 1130