navigation

[mebelyan]

Здравствуйте. Помогите начинающему. Есть сайт - www.mebelyan.com. При скролле вниз выплывает навигация. Мне  нужно чтобы она была фиксированная сверху с прозрачным фоном, а при скролле бекграунд был синий. Как сделать?

Вот исходники

<div class="menubar" data-scroll="true">        <a href="#" class="logo"></a>                        <ul class="mainmenu">            <li class="active"><a href="#home">Главная</a></li>            <li><a href="#services">Преимущества</a></li>            <li><a href="#portfolio">Наши работы</a></li>            <li><a href="#contact">Контакты</a></li>        </ul>            </div>

.menubar {	position: fixed;	top: 0px;	height: 50px;	width: 100%;	z-index: 9999;	background-color: #FFF;	margin-top: -80px;	-moz-box-shadow: 0 2px 2px rgba(0,0,0,0.2);	-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.2);	box-shadow: 0 2px 2px rgba(0,0,0,0.2);

// Menu Scroll Hide	var nav = $('.menubar');	var scroll = $('.menubar').attr('data-scroll');	$(function(){		$('.menubar').data('size','big');		if (scroll == 'false') {			nav.css({				marginTop:'0px'			});		};	});	$(window).scroll(function(){		if ($('body').scrollTop() > 0 && scroll == 'true') {			if (nav.data('size') == 'big') {				nav.data('size','small').stop().animate({					marginTop:'0px'				}, 300);			}		} else {			if (nav.data('size') == 'small' && scroll == 'true') {				nav.data('size','big').stop().animate({					marginTop:'-60px'				}, 300);			}					}	});