Foros del Web » Creando para Internet » CSS »

Problema con tab

Estas en el tema de Problema con tab en el foro de CSS en Foros del Web. Estoy armando unos tab con css y no logro hacer que cuando este seleccionado quede activo, me queda activo hasta que hago click en cualquier ...
  #1 (permalink)  
Antiguo 24/07/2007, 12:53
 
Fecha de Ingreso: agosto-2003
Mensajes: 203
Antigüedad: 14 años, 3 meses
Puntos: 0
Problema con tab

Estoy armando unos tab con css y no logro hacer que cuando este seleccionado quede activo, me queda activo hasta que hago click en cualquier otro lugar de la pagina. Ademas manejo con javascript el activar cada div a los que llama el tab. Dejo el código, espero puedan ayudarme.
css
Código:
A:link
{
    COLOR: #003366;
    TEXT-DECORATION: underline
}
A:visited
{
    COLOR: #003366;
    TEXT-DECORATION: underline
}
A:hover
{
    COLOR: blue;
    TEXT-DECORATION: underline
}
A:active
{
    COLOR: #0066ff;
    TEXT-DECORATION: none
}
a.tab {
	background-color: #e0e0e0;
	border: 1px solid #000000;
	border-bottom-width: 0px;
	padding: 2px 1em 2px 1em;
	position: relative;
	text-decoration: none;
	top: -1px;
	z-index: 100;
}
a.tab, a.tab:visited {  
	color: #808080;
}
a.tab:hover {
	background-color: #d0d0d0;
	color: #606060;
}
a.tab:Active{
	background-color: #d0d0d0;
	text-decoration: none;
	color: #000000;
}

a.tab.activeTab{
	color: #000000;
	background-color: #d0d0d0;
	text-decoration: none;
	z-index: 102;
}
a.tab.activeTab:hover, a.tab.activeTab:Active, a.tab.activeTab:visited{
	color: #000000;
	background-color: #d0d0d0;
	text-decoration: none;
	color: #000000;
}
Javascript
Código:
var idAnt;
idAnt = -1;
function selTab (id){
	var divElemAnt;
	var divElem = document.getElementById("tab"+id);
	if (divElem.style.display=="" || divElem.style.display=="none")
	{
		if (idAnt!=-1)
		{
			divElemAnt = document.getElementById("tab"+idAnt);
			divElem.className= 'tab';
			divElemAnt.style.display="none";
			divElemAnt.style.visibility="hidden";
		}
		divElem.style.display="";
		divElem.style.visibility = "visible";
		divElem.className= 'tab activeTab';
		idAnt = id;
	}
}
Html
Código:
<table>
<tr>
			
<td><a class="tab activeTab" id="ST8" href="javascript:" onclick=" if (idAnt==-1){idAnt=8; ST8.className='tab';} selTab(8)"><b>PREVISIONAL</b></a></td>
<td><a class="tab" id="ST4" href="javascript:" onclick=" if (idAnt==-1){idAnt=8; ST8.className='tab';} selTab(4)"><b>SISTEMAS</b></a></td>
</tr>
</table>
<div id="tab8" style="display:''; visibility:visible;">
1
</div>
<div id="tab4" style="display:none; visibility:hidden;">
2
</div>
Muchas Gracias
  #2 (permalink)  
Antiguo 24/07/2007, 15:04
 
Fecha de Ingreso: agosto-2003
Mensajes: 203
Antigüedad: 14 años, 3 meses
Puntos: 0
Re: Problema con tab

Finalmente me di cuenta que tenia un error en el codigo, estaba cambiandole el estilo al div del contenido en vez del al tab, le agregue el objeto del tab y a este le modifique el classname y funciono.

Gracias
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 03:34.