Foros del Web » Creando para Internet » CSS »

menu li problema con hover y activo

Estas en el tema de menu li problema con hover y activo en el foro de CSS en Foros del Web. a ver , mi problema es que yo arme este menu , anda perfecto, el tema es que cuando uno pasa el mouse por los ...
  #1 (permalink)  
Antiguo 25/07/2012, 19:01
 
Fecha de Ingreso: abril-2009
Mensajes: 409
Antigüedad: 15 años, 8 meses
Puntos: 3
menu li problema con hover y activo

a ver , mi problema es que yo arme este menu , anda perfecto, el tema es que cuando uno pasa el mouse por los distintos elementos en hover cambia el background como ven, buen lo que queria preguntar es , yo arme un estilo activo el cual toma el elemento activo en ese momento para quedar con el background de un color fijo , el problema es que cuando pasa por arriba, vuelve a tomar el color del li:hover y yo quiero que siga con el del activo, hay forma de hacer eso? (en este ejemplo el estilo activo y el li:hover tienen el mismo color pero la idea es que sean distintos)


Código HTML:
<nav class="menu">
<ul>
<li class="activo" ><a href="/bugzind/sitio/"><img
src="/bugzind/img/user_suit.png" alt="icono">Ver</a></li>
<li ><a href="/bugzind/sitio/update/"><img
src="/bugzind/img/vcard_edit.png" alt="icono"> Editar
datos</a></li>
<li  ><a href="/bugzind/sitio/upd_password/"><img src="/bugzind/img/lock_edit.png"
alt="icono"> Cambiar contraseña</a></li>
<li><a href="#"><img src="/bugzind/img/email_edit.png"
alt="icono"> Modificar email</a></li>
</ul>
</nav>





nav.menu {
	background-color: #ffffff;
	line-height: 23px;
	border-bottom: 1px dashed #ccc;
	padding-bottom: 5px;
}

nav.menu ul li {
	display: block;
	/*	margin: 0px 2px;*/
}

nav.menu ul li:hover {
	display: block;
	/*margin: 0px 2px;*/
	background-color: #ffdddd;
	/*width:180px;*/
}

.activo {
	display:block;
	background-color: #ffdddd;
}

.activo li:hover {
	background-color: #ff8e8e;
}

nav.menu ul li a {
	font-size: 11px;
	font-weight: normal;
	padding: 0 15px;
	text-decoration: none;
	display: block;
	color: #000000;
}
  #2 (permalink)  
Antiguo 25/07/2012, 23:17
Avatar de xlos_mas_pro  
Fecha de Ingreso: mayo-2011
Ubicación: Santiago
Mensajes: 359
Antigüedad: 13 años, 7 meses
Puntos: 11
Respuesta: menu li problema con hover y activo

si jquery puede ser hace lo siguiente haci
Código Javascript:
Ver original
  1. $(document).on('ready',function(){
  2.    
  3.     $('li').mouseenter(function(){
  4.           $('.ul').css({
  5.               'background' : '#ffdddd'
  6.          
  7.           });
  8.     });
  9.  
  10. })

Perdona no me dedique a revisar tu menu solo leer lo que pusiste jajajjajajajajja hice ese codigo con los estilos que invente cambialos a los estilos originales que eran los tuyos :D

Etiquetas: activo, hover, fondo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 14:09.