Passa il mouse sui dispositivi touch

Sto usando il seguente codice CSS noto per ottenere un menu a discesa su una pagina web.

div#menu ul ul { display: none; } div#menu ul li:hover ul { display: block; } 

Il menu è una lista u contenente un’altra lista u. Quando il mouse passa sopra la voce di elenco in questo menu, la seconda u-list diventa visibile. Le voci dell’elenco non sono link, solo testo.

Funziona con i browser moderni. Ho una javascript forge per IE6.

Tuttavia, non funziona su dispositivi touch.

Sull’IPad non succede nulla, anche se premo sulla voce dell’elenco. Questo è probabilmente, perché l’elemento della lista non è un’ancora. O forse, ho bisogno di un evento click per risolverlo.

Nel browser Android, una pressione prolungata sulla voce dell’elenco apre il sottomenu. Tuttavia, non è ansible selezionare alcun collegamento nel sottomenu.

Qualcuno può aiutarmi?

Nel caso, hai bisogno di dettagli (e avere il tempo), guarda

http://www.rene-grothmann.de/musica-aliter-test/

Grazie.

Prova ad annidare i tuoi elementi della lista in questo modo:

  

Non dovrebbe esserci un problema con lo stato di hover. Dovrebbe funzionare bene su qualsiasi dispositivo. Perchè è così che funziona per me.

div#menu ul li:hover ul deve diventare div#menu ul li:active ul per rispondere ai dispositivi touch perché non supportano gli stati hover.

Penso che i tuoi articoli della lista dovrebbero essere link. Dovresti almeno provarlo e vedere se funziona.