el menu lo pueden ver en la pagina http://strong.mx/
Mi problema es en el menu del lado izquierdo. inicialmente solo se iluminaria la opcion donde este el puntero pero luego se me pidio que al cambiar entre opcion y opcion se desvaneciera lento y apareciera lento.
aunque no se ve que desaparesca lento, logre que apareciera lento. el problema se da cuando el usuario pasa rapidamente muchas veces el puntero sobre las opciones. es un caos visual
y no se como evitar que pase eso. no puedo reducir mas el tiempo de la animacion por que no se persiviria.
este menu esta echo con jquery el codigo es este:
Código :
$(".men").each(function(i){ $(this).mouseenter(function(){ $(".mascara:eq("+i+")").fadeTo(150,1,function(){ //esto aparece el fondo negro del menu //modifico css de .men para que paresca }); }); $(this).mouseout(function(){ $(".mascara:eq("+i+")").fadeTo(150,0,function(){ //esto hace que no se vea el fondo negro //modifico css de .men para que desaparesca }); }); });
Solo posteo la parte central que es lo que hace la animacion, si tienen dudas sobre otras partes o quieren ayuda con algo que si me funciona con gusto lo compartire.
bien como saven el fadeTo cambia la opacidad de un div, lo use para colocar divs como mascaras y diera la apariencia de encenderce el boton. el termino :eq() me permite referirme a un objeto dentro de las clases en este caso i marca el numero de elemento a travajar.
ya trate de limitar con variables pero se hace un caos alguna otra sujerencia??
Forma en que trate de limitar con variables:
Código :
//todo el arreglo listo inicia en 0; $(".men").each(function(i){ $(this).mouseenter(function(){ [b]if(listo[i]==0){[/b] $(".mascara:eq("+i+")").fadeTo(150,1,function(){ //esto aparece el fondo negro del menu //modifico css de .men para que paresca [b]listo[i]=1;[/b] }); [b]}[/b] }); $(this).mouseout(function(){ [b]if(listo[i]==1){[/b] $(".mascara:eq("+i+")").fadeTo(150,0,function(){ //esto hace que no se vea el fondo negro //modifico css de .men para que desaparesca [b]listo[i]=0;[/b] }); [b]}[/b] }); });
En teoria jamas se seleccionaria un boton hasta que este apagado (listo=0) y jamas se apagaria un boton hasta que este encendido (listo=1). por eso modifico la variable listo hasta el fondo de la funcion. Pero no funciono. Alguna otra sujerencia???