Hola a todos, tengo un pequeño problemita y no se como darle solución.
Vean, tengo estás clases creadas en mi CSS:
.icon-home{background: url("../images/comvivem/ico_home.png") no-repeat
scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-home:hover{background: url("../images/comvivem/ico_home_hover.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-blog{background: url("../images/comvivem/ico_blog.png") no-repeat
scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-blog:hover{background: url("../images/comvivem/ico_blog_hover.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-event{background: url("../images/comvivem/ico_eventos.png") no-repeat
scroll 0 4px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-event:hover{background:
url("../images/comvivem/ico_eventos_hover.png") no-repeat scroll 0 4px
transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted
#CCCCCC}
.icon-messages{background: url("../images/comvivem/ico_mensajes.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-messages:hover{background:
url("../images/comvivem/ico_mensajes_hover.png") no-repeat scroll 0 5px
transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted
#CCCCCC}
.icon-members{background: url("../images/comvivem/ico-directorio.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-members:hover{background:
url("../images/comvivem/ico-directorio_hover.png") no-repeat scroll 0 5px
transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted
#CCCCCC}
.icon-friends{background: url("../images/comvivem/ico_amigos.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-friends:hover{background:
url("../images/comvivem/ico_amigos-hover.png") no-repeat scroll 0 5px
transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted
#CCCCCC}
.icon-account{background: url("../images/comvivem/ico_micuenta.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-account:hover{background:
url("../images/comvivem/ico_micuenta_hover.png") no-repeat scroll 0 5px
transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted
#CCCCCC}
.icon-admincp{background: url("../images/comvivem/ico_azul_perfil.png")
no-repeat scroll 0 5px transparent;padding: 0 0 0
35px;cursor:pointer;border-bottom:1px dotted #CCCCCC}
.icon-admincp:hover{background:
url("../images/comvivem/ico_azul_perfil.png") no-repeat scroll 0 5px
transparent;padding: 0 0 0 35px;cursor:pointer;border-bottom:1px dotted
#CCCCCC}
No se fijen en que estan repetidas pues aun tengo que optmizar un poco todo
esto ;). Bien tengo un UL que tiene varios LI:
<ul class="box_content_navigation">
<li class="icon-home first"><a href="inicio">Inicio</a></li>
<li class="icon-blog has_children"><a href="cmvblog">Blog</a>
<ul>
<li class="subitem first"><a href="cmvblog/create">Crear
entrada</a></li>
<li class="subitem last"><a
href="cmvblog/categories">Categorías</a></li>
</ul>
</li>
<li class="icon-event"><a href="event">Eventos</a></li>
<li class="icon-members"><a href="members">Directorio</a></li>
<li class="icon-friends last"><a href="relations">Amigos</a></li>
<li class="icon-messages"><a href="messages">Mensajes</a></li>
<li class="icon-account"><a href="edit-profile">Editar perfil</a></li>
<li class="icon-admincp hide-for-small"><a href="admin"
target="_blank">Panel de Control</a></li>
</ul>
Cuando doy click en cualquiera de ellos se añade un clase current. La
diseñadora me ha pedido que a esta clase current le cambie el color de
fondo y le mantenga el icono de color naranja (_hover). Hacer esto para el
color de fondo no es problema pero como hacerlo para los iconos?
Saludos y gracias por adelantado
Ing. Reynier Perez Mira
eMail: [email protected], reynier. <[email protected]>[email protected]
Website: http://www.reynierpm.com
Skype: reynierpm
Mobile: +58 424.180.5609
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
