вРазные полезности

Верхние меню для сайта uCoz

 
О меню:
Красивое верхнее меню для сайта системы ucoz. Шикарно будит смотреться на светлых сайтов. Как видите в меню есть поиск, кнопки в нем по дизайну выпуклые, смотрится красиво.

Code
<style>  
.topMenuborder-top:1px solid #51708c;border-bottom:1px solid #51708c;background:#648aad url(«http://zornet.ru/zornet_ru7/noize.png»);  
.topMenu2border-bottom:1px solid #769abc;background:url(«http://zornet.ru/zornet_ru7/highlight_faint.png») repeat-x 0 0;font-size:11px;color:#fafafa;text-shadow:0 -1px 0 #597a98;  
a.logotype:link, a.logotype:visitedtext-decoration:none;display:inline-block;*display:inline;padding:1px 0;background:url(«http://zornet.ru/zornet_ru7/uSitelogo.1328454987.png») no-repeat 0 -1px;width:96px;height:24px;margin:2px 4px 1px 0;vertical-align:top;  
a.logotype:hover, a.logotype:activetext-decoration:none;  
.wraphmenudisplay:inline-block;*display:inline;border-left:1px solid #51708c;border-right:1px solid #769abc;margin-bottom:-1px;  
a.hmenu:link, a.hmenu:visitedtext-decoration:none;font-size:11px;color:#fafafa;background:#648aad url(«http://usite.su/img/noize.png»);border-left:1px solid #769abc;border-right:1px solid #51708c;display:inline-block;*display:inline;  
a.hmenu:hover, a.hmenu:activetext-decoration:none;color:#fff;background:#6e96b5 url(«http://zornet.ru/zornet_ru7/noize.png»);border-left-color:#78a1bd;  
a.hmenu span.hpadding:8px 15px 8px 15px;background:url(«http://zornet.ru/zornet_ru7/highlight_faint.png») repeat-x 0 0;display:inline-block;*display:inline;border-bottom:1px solid #769abc;font-weight:bold;line-height:13px;  
.wrap-r-toolswidth:364px;float:right;text-align:right;  
.h .mprofAvatwidth:23px;  
.h .mprofAvat imgwidth:23px;height:23px;border:1px solid #51708c;  
.h .mprofTextvertical-align:top;padding-left:5px;font-size:11px;font-weight:bold;color:#fff;  
.h .mprofText divfont-size:10px;font-weight:normal;color:#d8eaf9;line-height:12px;  
.inputPoiskmargin-top:4px;vertical-align:top;width:100%;border:1px solid #51708c !important;  
.left-sidewidth:234px;border-left:1px solid #ddd;border-right:1px solid #ddd;background:rgba(245,245,245,0.65);-moz-box-shadow:inset 0px 0 0 0 #333, inset -12px 0 8px -8px #e9e9e9;-webkit-box-shadow:inset 0px 0 0 0 #333, inset -12px 0 8px -8px #e9e9e9;box-shadow:inset 0px 0 0 0 #333, inset -12px 0 8px -8px #e9e9e9;  
.side-news-tbackground:url(«http://usite.su/img/new/tr/newspaper.png») no-repeat 0px 1px;padding:3px 5px 3px 23px;color:#51708c;  
.side-news-mpadding-top:1px;padding-left:23px;line-height:15px;color:#3d3d3d;  
</style>  

<!—U1AHEADER1Z—>  

<script src=»/js/jquery.mousewheel.min.js»></script>  
<script src=»/js/common.js»></script>  
<script src=»/js/jquery.json-2.3.min.js»></script>  
<script src=»/js/jquery.autoresize.js»></script>  

<div style=»position: fixed; top: 0px; width: 100%; z-index: 99999;»>  
<div class=»topMenu»><div class=»topMenu2″><div class=»wrapdiz»>  

<div class=»wrap-r-tools»>  
<table border=»0″ cellpadding=»0″ cellspacing=»0″ width=»100%»>  
<tr>  
<td valign=»top» align=»left»>  
<input type=»text» value=»» placeholder=»Поиск» name=»q» maxlength=»100″ class=»inputPoisk» />  

</td>  
<td valign=»top» align=»right» style=»padding-left: 5px;»>  
<div class=»wraphmenu» id=»ws» style=»margin-right: -1px;»>  
<a href=»javascript://» rel=»nofollow» onclick=»new _uWnd(‘LF’,’ ‘,-250,-110,autosize:0,closeonesc:1,resize:1,url:’/index/40’);return false;» class=»hmenu» style=»vertical-align: top;»><span class=»h»>Войти</span></a><a href=»http://usite.su/index/3″ class=»hmenu» style=»vertical-align: top;»><span class=»h»>Регистрация</span></a>  
</div>  
</td>  
</tr></table>  
</div>  

<a href=»/» class=»logotype rad2″></a><div class=»wraphmenu»><a href=»/forum» class=»hmenu»><span class=»h»>Форум</span></a><a tt=»Скоро..» href=»javascript://» class=»hmenu»><span class=»h»>Блоги</span></a><a tt=»Откроются вместе с блогами» href=»javascript://» class=»hmenu»><span class=»h»>Мануалы</span></a><a href=»/forum/0-0-1-34″ class=»hmenu»><span class=»h»>Новые посты</span></a><a href=»/forum/0-0-1-35″ class=»hmenu»><span class=»h»>Люди</span></a></div>  

</div></div></div>  
</div><div style=»padding-top: 32px;»></div>  

<script type=»text/javascript»>  
$(‘#ws’).parent(‘td’).css(‘width’, $(‘#ws’).width()+1+’px’);  
$(‘.inputPoisk’).css(‘width’, $(‘.inputPoisk’).width()+8+’px’);  
sw = $(‘.inputPoisk’).width();  

$(‘.inputPoisk’).focus(function()  
$(‘#ws’).parent(‘td’).animate(opacity: ‘0’, 100).hide();  
$(this).animate(width: ‘100%’, 500);  
});  
$(‘.inputPoisk’).blur(function()  
if($(this).val().length<1)  
$(‘.saer-wrap’).animate(opacity: ‘0’, 100).hide();  

$(this).animate(width: sw+8+’px’, 50);  
$(‘#ws’).parent(‘td’).animate(opacity: ‘1’, 100).fadeIn(‘slow’);  
}  
});  
$(document).ready(function()   
  $(‘[tt], #tta’).hover(function()   
  $(‘#tta’).remove()  
  $(this).append(‘<div id=»tta»><div class=»ttu»></div><div class=»tt»><div class=»ttb»>’ + $(this).attr(‘tt’) + ‘</div></div>’);  
  $(‘#tta’).css(‘left’: $(this).offset().left + $(this).innerWidth() / 2 — $(this).children(‘#tta’).innerWidth() / 2,’paddingTop’: 5, ‘opacity’:’0’).animate(‘paddingTop’: 0, ‘opacity’:’1′, 150);  
  },function fO()   
  $(this).children(‘#tta’).fadeOut(150, function() $(this).children(‘#tta’).remove());  
  });  
});  

<!—U1AHEADER1Z—>

источник: zornet.ru

Похожие посты