// JavaScript, анимационные эффекты с использованием jQuery
(function($){

	$(document).ready(function() { // onload
		// верхнее меню
		$(".menu li a, .menu li span").hover(
			function(){$(this).stop().animate({left: '5', top: '-1'}, 200);},
			function(){$(this).stop().animate({left: '0', top: '0'}, 100);}
		);
		// боковое меню
		$(".menu-left li a").hover(
			function(){$(this).stop().animate({left: '10'},200);},
			function(){$(this).stop().animate({left: '0'},100);}
		);
		// инфобар
		$("#top_info").hover(
			function(){$("#ribbon").show();},
			function(){$("#ribbon").stop().hide();}
		);
		$("#top_info a").mouseover(
			function(){
				ppos = $(this).offset();
				tpos = $("#top_info").offset();
				twidth = $(this).width();
//				$("#ribbon").animate({left: ppos.left - tpos.left - 20, width: twidth}, 300).animate({left: ppos.left - tpos.left + 10}, 100).animate({left: ppos.left - tpos.left}, 50);
				$("#ribbon").animate({left: ppos.left - tpos.left - 20+210, width: twidth}, 300).animate({left: ppos.left - tpos.left + 10+210}, 100).animate({left: ppos.left - tpos.left+210}, 50);

			}
		);
	});
})(jQuery);