Наш клан
 

  • Страница 1 из 1
  • 1
Меню Как На Мегасофте
Сикарашка 
img 05.05.2010, Среда в 20:42  Сообщение #1



Сначала с CSS
Code
/* ====== Меню====== */      
#dropmenudiv {filter: alpha(opacity=95, enabled=1) progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=3);}     
#newpm {filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4);}     
div.div_busy_layer {filter: alpha(opacity=10);}     
table.quick_search {width: 100%;margin: 2px 0px 2px 0px;border: 0px;}     
table.quick_search td.left {width: 6px;height: 29px;background: url('/menu/modern_search_left_bg.gif') right top no-repeat;padding: 0px;margin: 0px;}     
table.quick_search td.center {background: url('/menu/images/modern_search_bg.gif') left top repeat-x;padding: 0px;margin: 0px;vertical-align: top;}     
table.quick_search td.center input {width: 100%;height: 16px;font-family: tahoma;font-size: 11px;border: 0px;background: #ffffff;margin: 5px 0px 0px 0px;text-align: center;color: #cccccc;}     
table.quick_search td.right {width: 30px;background: url('/menu/modern_search_bg_right.gif') left top no-repeat;padding: 0px;margin: 0px;cursor: pointer;}     
table.menu_category {width: 100%;background: url('/menu/modern_menu_category_bg_nonactive.gif') left top repeat-x;border: 0px;margin: 2px 0px 2px 0px;}     
table.menu_category:hover {background: url('http://polezn-ucoz.3dn.ru/menu/modern_menu_category_bg_active.gif') left top repeat-x;cursor: pointer;}     
table.menu_category td.left {width: 5px;height: 29px;background: url('/menu/modern_menu_category_bg_left.gif') right top no-repeat;padding: 0px;}     
table.menu_category td.roll {width: 44px;background: url('/menu/modern_menu_category_bg_roll.gif') left top no-repeat;padding: 0px;}     
table.menu_category td.roll:hover {background: url('/menu/modern_menu_category_bg_roll_active.gif') left top no-repeat;}     
table.menu_category td.right {width: 5px;background: url('/menu/modern_menu_category_bg_right.gif') left top no-repeat;padding: 0px;}     
table.menu_category td.image {width: 16px;text-align: center;vertical-align: middle;background: url('/menu/modern_menu_category_bg_center.gif') left top repeat-x;padding: 0px;}     
table.menu_category td.image img {border: 0px;padding: 0px 0px 2px 0px;}     
table.menu_category td.center {text-align: left;vertical-align: middle;background: url('/menu/modern_menu_category_bg_center.gif') left top repeat-x;padding: 0px 0px 3px 4px;font-family: tahoma, verdana, arial;color: #ffffff;font-weight: bold;font-size: 11px;letter-spacing: 0.5px;line-height: 12px;}     
table.menu_category_opened {width: 100%;background: url('/menu/modern_menu_category_bg_active.gif') left top repeat-x;border: 0px;margin: 2px 0px 2px 0px;}     
table.menu_category_opened td.left {width: 5px;height: 29px;background: url('/menu/modern_block_top.gif') left top no-repeat;padding: 0px;cursor: pointer;}     
table.menu_category_opened td.collapse {width: 44px;background: url('/menu/modern_menu_category_bg_collapse.gif') left top no-repeat;padding: 0px;cursor: pointer;}     
table.menu_category_opened td.collapse_hover {width: 44px;background: url('/menu/modern_menu_category_bg_collapse_active.gif') left top no-repeat;padding: 0px;cursor: pointer;}     
table.menu_category_opened td.image {width: 16px;text-align: center;vertical-align: middle;background: url('/menu/modern_block_top.gif') center top repeat-x;padding: 0px;cursor: pointer;}     
table.menu_category_opened td.image img {border: 0px;padding: 0px 0px 2px 0px;}     
table.menu_category_opened td.center {text-align: left;vertical-align: middle;background: url('/menu/modern_block_top.gif') center top repeat-x;padding: 0px 0px 3px 4px;font-family: tahoma, verdana, arial;font-size: 11px;color: #ffffff;font-weight: bold;line-height: 12px;letter-spacing: 0.5px;cursor: pointer;}     
table.menu_category_opened td.container {background: url('/menu/modern_block_right.gif') right top repeat-y;padding: 2px 7px 2px 0px;}     
table.menu_category_opened td.left_border {background: url('/menu/modern_menu_border_pixel.gif') left top repeat-y;padding: 0px;}     
table.menu_category_opened td.bottom_left {width: 5px;height: 5px;background: url('http://polezn-ucoz.3dn.ru/menu/modern_block_bottom.gif') left top no-repeat;padding: 0px;}     
table.menu_category_opened td.bottom_right {width: 5px;background: url('/menu/modern_block_bottom.gif') right top no-repeat;padding: 0px;}     
table.subcategories_table {width: 100%;padding: 0px;margin: 0px;}     
table.subcategories_table td.subcat_left {text-align: center;vertical-align: middle;width: 4px;padding: 0px;margin: 0px;}     
table.subcategories_table td.link {height: 20px;background: #ffffff;text-align: left;vertical-align: middle;padding: 0px 0px 0px 2px;font-family: tahoma, verdana, arial;font-size: 11px;color: #364683;font-weight: bold;line-height: 12px;letter-spacing: 0.5px;cursor: pointer;border: 1px solid #ffffff;}     
table.subcategories_table td.link_hover {height: 20px;text-align: left;vertical-align: middle;padding: 0px 0px 0px 2px;font-family: tahoma, verdana, arial;font-size: 11px;color: #364683;font-weight: bold;line-height: 12px;letter-spacing: 0.5px;cursor: pointer;background: #d9e8fa;border: 1px solid #364683;}     
table.subcategories_table td.link img,table.subcategories_table td.link_hover img {width: 16px;height: 16px;border: 0px;cursor: pointer;padding: 0px 4px 0px 0px;float: left;}     
img.icon {border: 0px;float: left;padding-right: 6px;width: 16px;height: 16px;}     
table.subheader_area {width: 100%;height: 24px;background: #4b97ce;border-width: 0px 1px 1px 1px;border-style: solid;border-color: #364683;text-align: left;vertical-align: middle;padding: 0px;margin: 0px;}     
table.subheader_area td {border-width: 0px 0px 0px 0px;border-style: solid;border-color: #364683;}     
td.main_menu {padding: 0px;vertical-align: top;border: 0px;}     
td.main_menu a:link ,td.main_menu a:active,td.main_menu a:visited {font-family: sans-serif, verdana, tahoma, arial; font-size: 10px;border-left: 1px solid #d9e8fa;border-right: 1px solid #d9e8fa;background: transparent;padding: 4px 5px 0px 4px;display: block;height: 22px;vertical-align: bottom;color: #575e60;line-height: 16px;text-decoration: none;font-weight: bold;}     
td.main_menu a:hover {font-family: sans-serif, verdana, tahoma, arial;font-size: 10px;border-left: 1px solid #364683;border-right: 1px solid #364683;background: #ffffff;padding: 4px 5px 0px 4px;cursor: pointer;display: block;height: 22px;vertical-align: bottom;color: #575e60;line-height: 16px;text-decoration: none;font-weight: bold;}     
td.main_menu img {text-align: left;}     
td.copyright {background: url('/menu/modern_footer_main_border_right.gif') bottom right no-repeat;text-align: left;vertical-align: middle;font-size: 11px;font-family: tahoma, verdana, arial;padding: 0px 0px 10px 0px;color: #ffffff;}     
td.copyright a:link ,td.copyright a:active,td.copyright a:visited {font-family: tahoma, verdana, arial;font-size: 11px;color: #19181a;text-decoration: none;font-size: 11px;}     
td.copyright a:hover {text-decoration: underline;}     
a.udleinf:link {text-decoration:none; color:#ffffff; font-weight:bold; font-family:Tahoma;}     
a.udleinf:active {text-decoration:none; color:#ffffff; font-weight:bold;}     
a.udleinf:visited {text-decoration:none; color:#ffffff; font-weight:bold;}     
a.udleinf:hover {text-decoration:underline; color:#ffffff; font-weight:bold;}     

/* ============ */

просто вставляем в CSS
дам вам два архива с картинками разных цветов
[indent]зелёный[/indent]
[indent]синий[/indent]
все эти файлы надо залить а папку menu
при желании можно подобрать свою цветовую схему

это сам вид меню

Code
<div id="menu_cat_40_closed">     
      <table cellpadding="0" cellspacing="0" class="menu_category">     
      <td class="left"></td>     
      <td class="image" onclick="location.href='http://polezn-ucoz.3dn.ru/';"><img src="/favicon.ico" border="0"></td>     
      <td class="center" onclick="location.href='http://polezn-ucoz.3dn.ru/';">Polezn-Ucoz</td>     
      <td class="roll" onclick="menu_cat_open( '40' );" title="Развернуть меню подкатегорий"></td>     
      </table>     
      </div>     
      <div id="menu_cat_40_show" style="display: none;">     
      <table cellpadding="0" cellspacing="0" class="menu_category_opened">     
      <tr>     
      <td class="left"></td>     
      <td class="image" onclick="location.href='http://polezn-ucoz.3dn.ru/';"><img src="/favicon.ico" border="0"></td>     
      <td class="center" onclick="location.href='http://polezn-ucoz.3dn.ru/';">Polezn-Ucoz</td>     
      <td class="collapse" onclick="close_menu_item( );" title="Свернуть меню подкатегорий" onmouseover="this.className='collapse_hover';" onmouseout="this.className='collapse';"> </td>     
      </tr>     
      <tr>     
      <td class="left_border"></td>     
      <td colspan="3" class="container">     
<table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/forum';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/favicon.ico" border="0">Форум</td>     
      </tr>     
      <table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/index/0-2';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/favicon.ico" border="0">Наши Баннеры</td>     
      </tr>     
      </table> <table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='http://file-and-photo.3dn.ru/';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/favicon.ico" border="0">Файлообменник</td>     
      </tr>     
<table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/gb';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/favicon.ico" border="0">Гостевая Книга</td>     

      </table> </td>     
      </tr>     
      <tr>     
      <td class="bottom_left"></td>     
      <td class="bottom_right" colspan="3"></td>     
      </tr>     
      </table>     
      </div>     

<div id="menu_cat_41_closed">     
      <table cellpadding="0" cellspacing="0" class="menu_category">     
      <td class="left"></td>     
      <td class="image" onclick="location.href='/forum/16';"><img src="/menu/modern_friends.gif" border="0"></td>     
      <td class="center" onclick="location.href='/forum/16';">Конкурсы</td>     
      <td class="roll" onclick="menu_cat_open( '41' );" title="Развернуть меню подкатегорий"></td>     
      </table>     
      </div>     
      <div id="menu_cat_41_show" style="display: none;">     
      <table cellpadding="0" cellspacing="0" class="menu_category_opened">     
      <tr>     
      <td class="left"></td>     
      <td class="image" onclick="location.href='/forum/16';"><img src="/menu/modern_friends.gif" border="0"></td>     
      <td class="center" onclick="location.href='/forum/16';">Конкурсы</td>     
      <td class="collapse" onclick="close_menu_item( );" title="Свернуть меню подкатегорий" onmouseover="this.className='collapse_hover';" onmouseout="this.className='collapse';"> </td>     
      </tr>     
      <tr>     
      <td class="left_border"></td>     
      <td colspan="3" class="container">     
<table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/forum/16-69-1';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/menu/modern_friends.gif" border="0">Раздача Асек</td>     
      </tr>     
      <table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/forum/16-218-1';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/menu/modern_friends.gif" border="0">Бонус "Группы Пользователей"</td>     
      </tr>     
      </table> <table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/forum/16-55-1';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/menu/modern_friends.gif" border="0">Раздача Хостов</td>     
      </tr>     
<table cellpadding="0" celspacing="0" border="0" class="subcategories_table"> <tr>     
      <td class="link" onclick="location.href='/forum/16-51-1';" onmouseover="this.className='link_hover';" onmouseout="this.className='link';"><img src="/menu/modern_friends.gif" border="0">Предложить свой Конкурс</td>     

      </table> </td>     
      </tr>     
      <tr>     
      <td class="bottom_left"></td>     
      <td class="bottom_right" colspan="3"></td>     
      </tr>     
      </table>     
      </div>     
      <script language="javascript">     
      <!--     
      var menu_cats_ids = new Array( "41","40" );     

      function menu_cats_close( )     
      {     
      for( var i = 0; i < menu_cats_ids.length; i++ )     
      {     
      element = mp_get_by_id( "menu_cat_" + menu_cats_ids[i] + "_closed" );     
      //alert( "menu_cat_" + menu_cats_ids[i] + "_closed" );     
      if( element.style.display == "none" )     
      {     
      element.style.display = "block";     
      }     
      element = mp_get_by_id( "menu_cat_" + menu_cats_ids[i] + "_show" );     
      if( element.style.display != "none" )     
      {     
      element.style.display = "none";     
      }     
      }     
      return true;     
      }     

      function menu_cat_open( id )     
      {     
      menu_cats_close( );     
      var element = mp_get_by_id( "menu_cat_" + id + "_show" );     
      //alert( element );     
      if( element.style.display == "none" )     
      {     
      element.style.display = "block";     
      }     
      element = mp_get_by_id( "menu_cat_" + id + "_closed" );     
      //alert( element );     
      if( element.style.display != "none" )     
      {     
      element.style.display = "none";     
      }     
      set_menu_cookie( id )     
      return true;     
      }     

      function set_menu_cookie( id )     
      {     
      if( id == 0 )     
      {     
      document.cookie = "menu_category_active=0; path=/";     
      return true;     
      }     
      var date = new Date();     
      date.setTime( date.getTime( ) + ( 2 * 60 * 1000 ) );     
      var expires = date.toGMTString( );     
      document.cookie = "menu_category_active=" + id + "; expires=" + expires + "; path=/";     
      }     

      function close_menu_item( )     
      {     
      menu_cats_close( );     
      var date = new Date();     
      date.setTime( date.getTime( ) );     
      var expires = date.toGMTString( );     
      document.cookie = "menu_category_active=0; expires=" + expires + "; path=/";     
      }     
      function preload_menu_images( images )     
      {     
      var images_path = "/images/";     
      if( images instanceof Array )     
      {     
      var virtual_images = new Array( images.length );     
      for( var i = 0; i < images.length; i++ )     
      {     
      if( document.images )     
      {     
      virtual_images[i] = new Image( 1, 1 );     
      virtual_images[i].src = images_path + images[i];     
      }     
      }     
      return true;     
      }     
      return false;     
      }     
      preload_menu_images( new Array( "modern_menu_category_bg_collapse_active.gif", "modern_menu_category_bg_collapse.gif", "modern_menu_category_bg_active.gif", "images/modern_menu_category_bg_roll_active.gif" ) );     
      -->     
      </script>

находим строчки
Code
<div id="menu_cat_40_closed"> и <div id="menu_cat_40_show" style="display: none;">

видим там цифру 40
её необходимо прописать в скрипте ниже
Code
var menu_cats_ids = new Array( "41","40" );

то есть,если вы создадите новый пункт меню то вам надо будет сделать так
Code
<div id="menu_cat_42_closed"> и <div id="menu_cat_42_show" style="display: none;">

и здесь
Code
<td class="roll" onclick="menu_cat_open( '42' );" title="Развернуть меню подкатегорий"></td>

и дописать в скрипт
Code
var menu_cats_ids = new Array( "41","42","40" );

и в head ставим

Code
<script language="javascript" type="text/javascript" src="/js/mediaportal_website.js"></script>     
<script language="javascript" type="text/javascript" src="/js/modern_smartmenu_config.js"></script>     
<script language="javascript" type="text/javascript" src="/js/modern_smartmenus.js"></script>

качаем и заливаем в папку js следующие файлы
mediaportal_website.js
modern_smartmenu_config.js
modern_smartmenus.js
Пользователь в офлайне     Карточка пользователя     Отправить личное сообщение
 
  • Страница 1 из 1
  • 1
Поиск:

Все материалы размещенные на сайте пренадлежат их владельцам и предоставляются исключительно в ознакомительных целях.
Администрация ответственности за содержание материала не несет и убытки не возмещает.
По истечении 24 часов материал должен быть удален с вашего компьютера.
Незаконная реализация карается законами РФ и Украины: "Об авторском и смежном праве".
При копировании материала, ссылка на сайт обязательна!