Hola a todos! Tengo este código CSS que apliqué a una página html el cual muestra solapas.
Código:
a.1 {
background: url('1.jpg') left no-repeat;
background-position: 0px ;
text-decoration: none;
pointer:cursor;
padding-left: 124px;
height:33px;
}
a.1:hover {
background: url('1b.jpg') left no-repeat;
background-position: 0px;
text-decoration: none;
padding-left: 124px;
pointer:cursor;
}
a.2 {
background: url('2.jpg') left no-repeat;
background-position: 0px ;
text-decoration: none;
pointer:cursor;
padding-left: 124px;
height:33px;
}
a.2:hover {
background: url('2b.jpg') left no-repeat;
background-position: 0px ;
text-decoration: none;
padding-left: 124px;
pointer:cursor;
}
.........
// código Css hasta la solapa 6
Las solapas tienen 2 imágenes, una ACTIVA y otra INACTIVA (los números deben estar impresos en el jpg) y al pasar el mouse por arriba hacen el rollover correspondiente. Hasta acá con mi código CSS funciona todo perfectamente... pero ahora viene el pedido de ayuda...
Lo que necesitaría saber es cómo se hace o se puede hacer (la imagen del medio ya hace el rollover, pero no aparece la solapa 1 como activada)... así como lo que muestra el ejemplo que les puse en el gráfico siguiente:
Realmente necesito su ayuda para terminar un trabajo para un cliente y me está exigiendo esto que no logro encontrarle la vuelta.
Un saludo a todos y muchas gracias de antemano.
Marx.