Posizionamento menu' su png unica

[a.felix]

Ho realizzato un menu' su png unica ....ho il css con i diversi stati e tutto funziona...
ma non riesco a far capire alla pagina quando sta' nella pagina x di prendere verticalmente la 4* posizione al menu [normal, hover, pressed, selected]

verticalmente la 4 posizione inizia a -153px

quindi avevo scritto una funzione del genere (premetto che e' una delle prime cose che scrivo da 0 in js..)

riporto all'inizio commentato parte del blocco del css e parte dell'html

/*
	#globalheader #globalnav li#gn-Home a:active { background-position: 0 -102px; }
#globalheader #globalnav li#gn-Giocatori a:active { background-position: -141px -102px; }
#globalheader #globalnav li#gn-Servizi a:active { background-position: -282px -102px; }
#globalheader #globalnav li#gn-News a:active { background-position: -423px -102px; }
#globalheader #globalnav li#gn-Newsletters a:active { background-position: -564px -102px; }
#globalheader #globalnav li#gn-Contatti a:active { background-position: -705px -102px; }

  <li id="gn-Home">Home
		<li id="gn-Giocatori">Giocatori
		<li id="gn-Servizi">Servizi
		<li id="gn-News">News
		<li id="gn-Newsletters">Newsletters
		<li id="gn-Contatti">Contatti
		
	*/
	var pg_Home="Test.html";
	var pg_Giocatori="pag2.html";
	var pg_Servizi="pag3.html";
	var pg_News="pag4.html";
	var pg_Newsletters="pag5.html";
	var pg_Contatti="pag6.html";
	var H_position = "-153px";
	
	
	var sPath = window.location.pathname;
	var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
	
	switch (sPage) {
  case pg_Home:
  var $ItemsMenu = document.getElementById(gn-Home);
    $ItemsMenu.style.background-position= "0px " + H_position;
  break;
  case pg_Giocatori:
    var $ItemsMenu = document.getElementById(gn-Giocatori);
    $ItemsMenu.style.background-position= "-141px " + H_position;
  break;
  case pg_Servizi:
    var $ItemsMenu = document.getElementById(gn-Servizi);
    $ItemsMenu.style.background-position= "-282px " + H_positionn;
  break;
    case pg_News:
	  var $ItemsMenu = document.getElementById(gn-News);
    $ItemsMenu.style.background-position= "-423px " + H_position;
  break;
    case pg_Newsletters:
	  var $ItemsMenu = document.getElementById(gn-Newsletters);
    $ItemsMenu.style.background-position= "-564px " + H_position;
  break;
    case pg_Contatti:
	  var $ItemsMenu = document.getElementById(gn-Contatti);
    $ItemsMenu.style.background-position= "-705px " + H_position;
  break;

  default:

}

che sbaglio???

[a.felix]

Cosi' non da' errori ma non funziona neanche..

	var pg_Home="Test.html";
	var pg_Giocatori="pag2.html";
	var pg_Servizi="pag3.html";
	var pg_News="pag4.html";
	var pg_Newsletters="pag5.html";
	var pg_Contatti="pag6.html";
	var H_position = "-153px";
	
	
	var sPath = window.location.pathname;
	var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
	
	switch (sPage) {
  case pg_Home:
    document.getElementById('gn-Home').style.backgroundPosition  = "0px -153px";
  break;
  case pg_Giocatori:
    document.getElementById('gn-Giocatori').style.backgroundPosition  = "-141px " + H_position ;
  break;
  case pg_Servizi:
    document.getElementById('gn-Servizi').style.backgroundPosition  = "-282px " + H_position ;
  break;
    case pg_News:
    document.getElementById('gn-News').style.backgroundPosition  = "-423x " + H_position ;
  break;
    case pg_Newsletters:
    document.getElementById('gn-Newsletters').style.backgroundPosition  = "-564px " + H_position ;
  break;
    case pg_Contatti:
    document.getElementById('gn-Contatti').style.backgroundPosition  = "-705px " + H_position ;
  break;

  default:

}