Foros del Web » Creando para Internet » CSS »

Cambiar color de fuente en la pestaña activa (tabs - jquery)

Estas en el tema de Cambiar color de fuente en la pestaña activa (tabs - jquery) en el foro de CSS en Foros del Web. Hola a todos!!!!!!!!!! Estoy rompiéndome la cabeza para cambiar el color del texto de una pestaña o tab activa. Quiero que mientras esté activa esté ...
  #1 (permalink)  
Antiguo 27/08/2011, 14:59
tap
 
Fecha de Ingreso: mayo-2009
Mensajes: 58
Antigüedad: 7 años, 6 meses
Puntos: 5
Cambiar color de fuente en la pestaña activa (tabs - jquery)

Hola a todos!!!!!!!!!!
Estoy rompiéndome la cabeza para cambiar el color del texto de una pestaña o tab activa. Quiero que mientras esté activa esté en blanco y la que no lo está sea de color negro. Hice un sinfín de variantes pero no lo conseguí. Alguna ayuda, por favor!!!!!!!!!
mi código es el siguiente, es muy simple, por eso me siento tan mal:
Código:
ul.tabs {
   margin:0;
   padding:0;
   float:left;
   list-style:none;
   /*border-bottom:1px #999 solid;
   border-left:1px #999 solid;*/
   width:100%;
}

ul.tabs li {
   float:left;
   margin:0;
   padding:0;
   height:36px;
   width:197px;
   background-image:url(../img/tab-b.png);
   margin-left:15px;
   color:#333;
   overflow:hidden;
   position:relative;
}

ul.tabs li a {
   text-decoration:none;
   color:#333;
   display:block;
   font:1.2em Tahoma, Geneva, sans-serif;
   line-height:40px;
   padding:0 20px 0;
   outline:none;
}
ul.tabs li.active,  li.active a, li.active a:hover {
   color:#bababa;
}

ul.tabs li a:hover {
   color:#222;
}

html ul.tabs li.active, html ul.tabs li.active a:hover {
   background-image:url(../img/tab.png);
   color:#fff;
}

html ul.tabs li.active {
   color:#fff;
}
  #2 (permalink)  
Antiguo 27/08/2011, 17:10
Avatar de hombrelectrico  
Fecha de Ingreso: agosto-2011
Mensajes: 10
Antigüedad: 5 años, 3 meses
Puntos: 0
Respuesta: Cambiar color de fuente en la pestaña activa (tabs - jquery)

Prueba agregando esto...

Código HTML:
ul.tabs li.active,  li.active a{
background: #fff;
}
PD.: Utiliza firebug en estos casos, te puede evitar este tipo de trabas.
  #3 (permalink)  
Antiguo 27/08/2011, 18:07
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 9 años, 5 meses
Puntos: 1567
Respuesta: Cambiar color de fuente en la pestaña activa (tabs - jquery)

Dependiendo que version de tabs c/jQuery estés usando, puede ser algo sencillo, o un poco compicado.

Esta es una versión sencilla
http://jqueryfordesigners.com/demo/tabs.html

ahi tan solo en el css

Código CSS:
Ver original
  1. UL.tabNavigation LI A.selected,
  2. UL.tabNavigation LI A:hover {
  3. background-color: #333;
  4. color: red;
  5. padding-top: 7px;
  6. }

Definis el color para el link activo


Este es otro bueno y facil de editar para lo que queres
http://guedea.blogspot.com/2008/12/t...do-jquery.html

en el css, en
ul.titulos li a.activo definis el color que queres
Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.

Última edición por emprear; 27/08/2011 a las 18:15

Etiquetas: color, html, pestaña, tabs, fuentes, fondo, activo
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 08:31.