menu multilivello

[francescocorr]

Salve ragazzi, vorrei chiedervi una mano.
Sto utilizzando una piattaforma ed ho un menù multilivello che non riesco a personalizzare.

Vorrei un effetto del genere.

voce 1 (background rosso se selezionata)
subvoce1 (colore rosso se lelezionata)
subvoce2 (background rosso se lelezionata)
sub-sub-voce1-2 (colore rosso se lelezionata)
subvoce3 (colore rosso se lelezionata)

L'effetto dovrebbe essere se seleziono un gruppo la voce principale di primo livello o di secondo se ha un terzo livello dovrebbe avere il background rosso e la voce selezionata di colore rosso...

il codice che mi genera la piattaforma per i link è il seguente

<ul class="navigationMenu" id="navigation0">
 	[*]
 		#
 	
 	[*]
 		#
 		<ul>
 			[*]
 				# 			    
                         		[*]
 				# QUESTA SFONDO ROSSO				             
 
                        <ul>
 					[*]
 						#
 					
 					[*] 						
                                                # QUESTA ROSSA 
					
 				[/list]
 			
 		[/list]
 	
 	[*]
 		#
 	[/list]

ul.navigationMenu, ul.navigationMenu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  padding: 0;
  font-weight: bold;
}

ul.navigationMenu {
	padding-top: 8px;
	border-top: 3px solid #AA000E;
}

ul.navigationMenu li {
   margin: 1px 0px;
}

ul.navigationMenu ul {
   margin: 0;
}

ul.navigationMenu  a:link,
ul.navigationMenu  a:visited
{
	color: #00496F; 
	font-weight: lighter;
}

ul.navigationMenu  li a ,
ul.navigationMenu  li span {
   border-bottom: 0;
   padding: 1px 0 2px 0;
   display: block;
   margin: 0px;   
   text-decoration: none;
   color: #00496F;
}

ul.navigationMenu li span.current,
ul.navigationMenu li a.current
{
   background-color: #AA000E;
   color: #fff;
   padding-left: 3px;
   padding-top: 5px;
}


ul.navigationMenu li a.current:hover
{
   color: #999;
}

ul.navigationMenu ul li a {
   background: #AA000E;
}


.navigationMenu ul li ul li a {
   background: #AA000E;
}


ul.navigationMenu li ul li a,
ul.navigationMenu li ul li span {
   color: #999;
   margin-left: 10px;
   padding: 0 0 0 12px;
   font-size: 95%;
}


ul.navigationMenu ul li span.current,
ul.navigationMenu ul li a.current {
   color: #AA000E;
   background: transparent;   
   margin-left: 10px;
   padding: 0 0 0 10px;
   font-size: 95%;
}


ul.navigationMenu li ul li ul li a,
ul.navigationMenu li ul li ul li span {
   background-color: #F2F8F9;
   margin-left: 20px;
   padding: 0 0 0 12px;
   color: #AA000E;
}

ul.navigationMenu li ul li span.current, ul.navigationMenu li ul li a.current{
	background: #AA000E;
}


ul.navigationMenu li ul li ul li span.current, 
ul.navigationMenu li ul li ul li a.current {
   background-color: #F2F8F9;
   margin-left: 20px;
   padding: 0 0 0 14px;
   color:#AA000E;
}

ul.navigationMenu a.current:hover,
ul.navigationMenu a:hover {
   color: #A81500;
   text-decoration: none;
}

ul.navigationMenu li ul li ul li ul li a,
ul.navigationMenu li ul li ul li ul li span {
   margin-left: 26px;
   padding: 0 0 0 12px;

}
ul.navigationMenu li ul li ul li ul li span.current, 
ul.navigationMenu li ul li ul li ul li a.current {
   margin-left: 26px;
   width: 75px; 
   padding: 0 0 0 14px;
}

ul.navigationMenu li ul li ul li ul li ul li a,
ul.navigationMenu li ul li ul li ul li ul li span {
   margin-left: 32px;
   padding: 0 0 0 12px;

}
ul.navigationMenu li ul li ul li ul li ul li span.current, 
ul.navigationMenu li ul li ul li ul li ul li a.current {
   margin-left: 32px;
   padding: 0 0 0 14px;
}

Sinceramente mi sono perso un pò!!!
non riesco a capire cosa devo fare affinchè funzioni.

Grazie
Frank

[francescocorr]

Uppettino!!!

[francescocorr]

nessuno ha qualche dritta sulla questione?
Grazie...
Frank

[ResianTaxidrive]

e il problema è...? che non ti funziona?
Hai provato a vedere esempi di menu funzionanti tipo ad es. quelli di CSS Play?
Guardando velocemente il tuo codice immagino che tu debba avere più classi come quelle che tu hai chiamato "current". A ogni livello devi poter controllare se c'è o meno la selezione.
Credo che comunque tu faccia prima a guardare qualcosa di già pronto e adattarlo ai tuoi scopi.

[francescocorr]

Purtroppo come specificavo prima è un cms e non posso modificare il codice che genera il menù.
Volevo sapere se c'era qualche modo tramite css per poterlo ottenere.

Grazie
Frank

[ResianTaxidrive]

hai un link al sito in questione?

[francescocorr]

no mi dispiace è in locale.
Se posso fornirti altre indicazioni...

Grazie

[ResianTaxidrive]

allora se ho ben capito, supponiamo di avere un menu a 3 livelli. Tu vuoi che se ho cliccato su una voce del terzo livello anche i genitori devono essere colorati in qualche modo, giusto?
Per far ciò devi avere la possibilità di assegnare una classe anche a questi genitori, ma se tu non hai la possibilità di metter mano al codice che genera il menu, la vedo dura. Non mi risulta che solo tramite css tu lo possa fare, ma potrebbe esserci qualche nuova feature di css3 che io ignoro.

Altrimenti devi "iniettare" le classi tramite javascript ai genitori del menu che hai selezionato e allora le puoi pilotare con il css.

[francescocorr]

Grazie delle dritte.
Purtroppo non posso mettere mano al codice. Non mi è consentito.

Cerco qualcosa via js.
Conosci tu qualche cosa?

Grazie per l'aiuto.