var menuItemWidth = 157;

function getMenuItemIndex(menuItem) {
	var sfEls = document.getElementById("mainMenu").childNodes;
	var cnt = 0;
	for (var i=0; i<sfEls.length; i++) {
		  if (sfEls[i].nodeName == "LI") {
			  cnt++;
			  if (menuItem == sfEls[i])
				  return cnt > 1 ? 2 : cnt;
		  }
	}
	return -1;
}

function menuFix() {
 //var sfEls = document.getElementById("mainMenu").getElementsByTagName("li");
	var sfEls = document.getElementById("mainMenu").childNodes;
 //alert(sfEls.length);
 for (var i=0; i<sfEls.length; i++) {
  if (sfEls[i].nodeName == "LI") {
	  sfEls[i].onmouseover=function() {
		  this.className+=(this.className.length>0? " ": "") + "sfhover";
		  var index = getMenuItemIndex(this);
		  var posX = -(index-1) * menuItemWidth;
		  var aEle = this.childNodes[0];
		  aEle.style.backgroundPosition = posX + "px -70px";

		  //var menuBG = document.getElementById("popupMenuBG");
		  //menuBG.className = "menuBGon";
	  }
	  sfEls[i].onmousedown=function() {
		  this.className+=(this.className.length>0? " ": "") + "sfclick";
		  var index = getMenuItemIndex(this);
		  var posX = -(index-1) * menuItemWidth;
		  var aEle = this.childNodes[0];
		  aEle.style.backgroundPosition = posX + "px -35px";

		  //var menuBG = document.getElementById("popupMenuBG");
		  
	  }
	  sfEls[i].onmouseup=function() {
		  //this.className+=(this.className.length>0? " ": "") + "sfhover";

		  //var menuBG = document.getElementById("popupMenuBG");
		  
	  }
	  sfEls[i].onmouseout=function() {
		  this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"), "");
		  this.className=this.className.replace(new RegExp("( ?|^)sfclick\\b"), "");
		  
		  //var menuBG = document.getElementById("popupMenuBG");
		  //menuBG.className = "menuBGoff";
	  }
  }
 }
 //alert(cnt);
}
window.onload=menuFix;