﻿//j

$(document).ready(function(){		
		$('#menu > li').hover(
			function() { 
				pos =  Math.round($('#menu li').offset().left - $('#menu').offset().left);
				$(this).find('ul').css('left', pos);
				$(this).find('ul').css('visibility', 'visible');
				//alert($('#menu').position().left);
				$('ul', this).fadeIn(100); 
			},
			function() { 
				$('ul', this).fadeOut(100);  		
			});
		//$(".sub").corner();
});
	$(document).ready(function () {
		$('#menu').append('<div id="box"><div class="head"></div></div>');

		//transitions
		//for more transition, goto http://gsgd.co.uk/sandbox/jquery/easing/
		var style = 'easeOutBack';
		
		//Retrieve the current item position and width
		var default_left = Math.round($('#menu > li.current').offset().left - $('#menu').offset().left);
		var default_width = $('#menu > li.current').width();

		//Set the floating bar position and width
		$('#box').css({left: default_left});
		$('#box .head').css({width: default_width});

		//if mouseover the menu item
		$('#menu > li').hover(function () {
			
			//Get the position and width of the menu item
			left = Math.round($(this).offset().left - $('#menu').offset().left);
			left2 = Math.round($(this).offset().left);
			width = $(this).width(); 

			//Set the floating bar position, width and transition
			//$('#menu').find('ul').stop(false, true).animate({left: left2},{duration:1000, easing: style});	
			//$('#menu').find('ul').css('left', left);
			$('#box').stop(false, true).animate({left: left},{duration:1000, easing: style});	
			$('#box .head').stop(false, true).animate({width:width},{duration:1000, easing: style});	
		
		//if user click on the menu
		}).click(function () {
			
			//reset the current item
			$('#menu > li').removeClass('current');	
			
			//select the current item
			$(this).addClass('current');
	
		});
		
		//If the mouse leave the menu, reset the floating bar to the current item
		$('#menu').mouseleave(function () {

			//Retrieve the current item position and width
			default_left = Math.round($('#menu li.current').offset().left - $('#menu').offset().left);
			default_width = $('#menu li.current').width();
			
			//Set the floating bar position, width and transition
			$('#box').stop(false, true).animate({left: default_left},{duration:1500, easing: style});	
			$('#box .head').stop(false, true).animate({width:default_width},{duration:1500, easing: style});		
			
		});
		
	});
	//DD_roundies.addRule('.sub', '5px', true);
	//DD_roundies.addRule('.barra_dir', '5px');

