var ROOT = '.';
var timer;

function imgHover(item){
	var img  = item.firstChild;
	var href = item.getAttribute('href');
	var id   = href.replace(/^.*\/|\.[^.]+$/g, '');
	img.src  = ROOT + '/images/nav_' +  id + '_b.png';
	
	var line = document.getElementById('nav-lines');
	if(line){
		if(timer){
			clearTimeout(timer);
		}

		line.style.display = 'block';

		var x = getSize(item, 'offsetLeft');
		var y = item.offsetTop + item.offsetHeight + 130;

		var height = line.parentNode.offsetHeight - y + 50;

		line.style.left   = x + 'px';
		line.style.top    = y + 'px';
		line.style.height = height + 'px';
	}
}

function imgNormal(item){
	var img  = item.firstChild;
	var href = item.getAttribute('href');
	var id   = href.replace(/^.*\/|\.[^.]+$/g, '');
	img.src  = ROOT + '/images/nav_' +  id + '_a.png';
	var line = document.getElementById('nav-lines');
	if(line){
		timer = setTimeout(function(){
			line.style.display = 'none';
		}, 100)
	}
}

function getSize(element, prop){
	var s = element[prop];
	while(element.parentNode){
		element = element.parentNode;
		if(element[prop]){
			s += element[prop];
		}
	}
	return s;
}

