Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Ahm_Shere en 9 Agosto 2012, 14:15 pm



Título: Cómo crear menu con varios estados?
Publicado por: Ahm_Shere en 9 Agosto 2012, 14:15 pm
hola amig@s foreros tengo un pequeño problema quiero crear un menu en dreamweaver cs3 con varios estados es decir si lo hago por lista el menu tiene dos estados el normal y el que cuadno paso con el raton por encima cambia d color, pues bien me gustaria añadir un tercero en el que por ejemplo se ponga las letras en negrita y el fondo en otro color cuando estes en esa sección por ejemplo en servicios destaque diferente alos demas para saber que estas en servicios, nose si me explico, bueno el mejor ejemplo es la pagina web softonic.com, en el que si vas al menu lateral derecho donde sale windows mac etc... al pasar por encima con el raton se pone a un color marroncito pero si clikeas en mac por ejemplo se pone en blanco para destacar que estas en mac y me gustaria saber hacer eso ya sea por menu de lista o por imagenes muchas gracias un saludo ;).


Título: Re: Cómo crear menu con varios estados?
Publicado por: Spider-Net en 9 Agosto 2012, 14:34 pm
Échale un vistazo a jQuery y a los métodos addClass (http://api.jquery.com/addClass/) y removeClass (http://api.jquery.com/removeClass/).

A resumidas cuentas lo que tienes que hacer es un menú tipo lista o como quieras, con css le pones los valores que quieras. Luego al mismo menú en el evento :hover le pones con CSS los cambios que quieres que tenga cuando se pasa el mouse por encima.

Por último creas una clase .activo por ejemplo. Y con jQuery haces que cuando hagas click sobre una de las opciones del menú adquiera la clase "activo" y al resto le quitas la clase "activo". De esta forma cuando hagas click en cualquier opción del menú esta quedará marcada de una forma diferente (ya sea negrita, subrayado, con otro fondo o lo que quieras) hasta que pulses en otra opción del menú.


Título: Re: Cómo crear menu con varios estados?
Publicado por: Ahm_Shere en 9 Agosto 2012, 17:48 pm
hola spider-net gracias por tu respuesta pero me podrias expilcar mejor como hacerlo porque no tengo ni idea del jquery si me pudieses pasar un videotutorial o un manual y a que he mirado opr la web pero no encuentro nada que me ayude, muchas gracias un saludo ;).