Tema: menu hover
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 30/01/2012, 14:28
helenp
 
Fecha de Ingreso: mayo-2009
Mensajes: 382
Antigüedad: 15 años
Puntos: 6
menu hover

Hola,
Tengo un menu css que usa hover, es que hover es lo suyo porque lleva varios niveles y me acabo de enterar que no fucniona en pantallas táctiles el hover...

Tengo en el css esto entro otro:
#menu ul ul .level2:hover {color:#000099; background:#FFFF99;}
#menu a:hover {color:#000099; background:#FFFF99;}
#menu li:hover {position:relative; z-index: 500;}
#menu ul ul {position:absolute;}
#menu ul ul ul {top:-1px; left:100%;}
div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul {display: none;}
div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul {display: block;}

He enctontrado un pagina que se trata de prepara la web para iphone, y no sé si la solución vale para todo o solo para iphone y como no tengo nada táctil, pues es dificil de comprobar.
He encontrado este javascript que supuestamente cambiaría el hover por ontouche:
var myLinks = document.getElementsByTagName('a');
2 for(var i = 0; i < myLinks.length; i++){
3 myLinks[i].addEventListener('touchstart', function(){this.className = "hover";}, false);
4 myLinks[i].addEventListener('touchend', function(){this.className = "";}, false);
5 }

Si alquien me puede guiar, gracias.