var $height = 330;
var $target = null;
var $rel = null;
var $items = [];
var $timeouts_enter = [];
var $timeouts_leave = [];

function naviOnMouseLeave($obj) {
	if ($timeouts_enter[$rel]) clearTimeout($timeouts_enter[$rel]);
	$timeouts_leave[$rel] = window.setTimeout(function() {
		$obj.animate({
			bottom: ($height+3) + 'px'
		}, 1000);
	}, 500);
}

function naviOnMouseEnter($obj, $t) {
	if ($timeouts_leave[$rel]) clearTimeout($timeouts_leave[$rel]);
	$timeouts_enter[$rel] = window.setTimeout(function() {
		$obj.animate({
			bottom: '0'
		}, 1000);
	}, 500);
}

$().ready(function() {
	$height = $('#subNaviInfos').height();
	
	$('.naviHome a').each(function(index) {
		$items[$(this).attr('rel')] = $('#info_' + $(this).attr('rel'));
	});
	
	$('.subNaviInfo').css('bottom', $height+3).bind('mouseenter', function(event) {
	/*	if ($timeouts_enter[$rel]) clearTimeout($timeouts_enter[$rel]);
		if ($timeouts_leave[$rel]) clearTimeout($timeouts_leave[$rel]);
	*/	
		var $id = $(event.target).closest('div.subNaviInfo').attr('id');
		$id = $id.split('_');
		$id = $rel = $id[1]+'_'+$id[2];
		if ($timeouts_leave[$id]) clearTimeout($timeouts_leave[$id]);
	});
	
	$('.naviHome').bind('mouseenter', function(event) {
		if ($(event.target).parent().is('li.naviHome')) {
			$target = $(event.target);
			$rel = $target.attr('rel');
			naviOnMouseEnter($items[$rel]);
		} 
	});
	
	$('.naviHome').add('.subNaviInfo').bind('mouseleave', function(event) {
		naviOnMouseLeave($items[$rel]);
	});
});