var trans; //variables de intervalo
var widthTrans;
var nonselected = true; //temporal



function iniMenu()
{

setLiOnClickFunctions();
}





		function setDim(button, desf) 
		{
    		var divEle, dist, incr, firstdivEle, aux;

        divEle = button.parentNode.parentNode.getElementsByTagName("div");
				firstdivEle = divEle[0];
				dist = Math.abs(button.offsetLeft-firstdivEle.offsetLeft); 
								 
				incr = dist/ 10;
        incr -= dist/100;
				clearInterval(widthTrans);
			
			
				
				                   widthTrans = setInterval(function(){ //meter en una funcion
													if (button.offsetWidth<firstdivEle.offsetWidth)
													{
													firstdivEle.style.width = firstdivEle.offsetWidth-1 + "px";
													} 
													if (button.offsetWidth>firstdivEle.offsetWidth)
													{
													firstdivEle.style.width = firstdivEle.offsetWidth+1 + "px";
													}
													if (button.offsetWidth==firstdivEle.offsetWidth)
													{
													clearInterval(widthTrans);

													}
													
													},10);
						
				if (button.offsetLeft > firstdivEle.offsetLeft+desf)
				{

						
						clearInterval(trans);	 
				    trans = setInterval(function() {    						 
								 if (firstdivEle.offsetLeft < button.offsetLeft+desf)
    						 {
	
								
                 
    						 firstdivEle.style.left=firstdivEle.offsetLeft+incr + "px";
    						 } else { 
								 
								 	 				clearInterval(trans);
                         if (dist>2)
												 {
													setDim(button, desf-10);
													} else { firstdivEle.style.left = button.offsetLeft + "px"; }
							        

													}
							},10); //SETINTERVAL END
				}
				if (button.offsetLeft < firstdivEle.offsetLeft-desf)
				{						
				 	 	 clearInterval(trans);								
    				 trans = setInterval(function() { 
    						 if (firstdivEle.offsetLeft > button.offsetLeft-desf)
    						 {
    						 firstdivEle.style.left= firstdivEle.offsetLeft-incr +"px";
    						 } else { 
						 
								          clearInterval(trans); 
 													if (dist>2)
													{
													setDim(button, desf-10);
													} else { firstdivEle.style.left = button.offsetLeft + "px"; }
		 
												
    
                        		
													}
						 },10); //SETINTERVAL END
				}
        if (button.offsetLeft == firstdivEle.offsetLeft)
				{

    				clearInterval(trans);
				}  

		}


function setLiOnClickFunctions() 
{
    var HTMLTags=document.getElementsByTagName("ul"); 
		var liElements;
		var divEle, selected, firstdiv, nonselected = true, hid;
		for (i=0; i<HTMLTags.length; i++) 
		{
    		if (HTMLTags[i].className=="menulava") 
				{
				 	 	divEle = HTMLTags[i].parentNode.getElementsByTagName("div");															 
				 	 	//divEle =  document.createElement("div");
				 	 	//HTMLTags[i].parentNode.appendChild(divEle); //adding <div>																 
				 	 	liElements = HTMLTags[i].getElementsByTagName("li");
						firstdiv = divEle[0];
            		selected = liElements[0];
					   firstdiv.style.width = "100px";
						firstdiv.style.left = "-100px";
						loc = window.location;	
						portfolioPrefix = /portfolio-/;
						aboutPrefix = /about-/;			
						
						if (portfolioPrefix.test(loc))
						{
							removeClass(document.getElementById("home"), "selected");
							document.getElementById("portfolio").className= "selected";
						} else if (aboutPrefix.test(loc)) { 
							removeClass(document.getElementById("home"), "selected");
							document.getElementById("about").className= "selected";				
							}
						
						for (n=0;n<liElements.length;n++)
						{
						    if ((liElements[n].firstChild.href == loc) || (liElements[n].className == "selected"))
								{
								 	firstdiv.style.left = liElements[n].offsetLeft + "px"; 
									firstdiv.style.width = liElements[n].offsetWidth + "px"; //initial width
								  firstdiv.style.display = "inline";
									selected = liElements[n];
									nonselected = false;
								}
						 		liElements[n].onmouseover = function(){ 
								firstdiv.style.display = "inline";
								setDim(this, 10); };	
								liElements[n].onmouseout = function (){ 
								setDim(selected, 10); 
						
								       };
								liElements[n].onclick = function() { 
    								    
												var liEles = this.parentNode.getElementsByTagName("li");
												var thisEle = this;
												var aEle = this.getElementsByTagName("a");
												
												window.location = aEle[0].href; //obtaining <a> href
        								for (h=0;h<liEles.length;h++)
        								{
												liEles[h].onmouseout = function() { setDim(thisEle,10); };
        								}
								     };
				
						}
				}
				
		}
}





function createDivElement(parent) {
		 
		 ele = document.createElement("div");
     parent.appendChild(ele);
		 return ele;
}