Foros del Web » Creando para Internet » CSS »

Ayuda con Pestañas, solas o tabs de noticias

Estas en el tema de Ayuda con Pestañas, solas o tabs de noticias en el foro de CSS en Foros del Web. hola estoy intentando hacer un tab de noticias y anda perfectamente lo que no logro hacer es que cuando se selecciona una opcion de la ...
  #1 (permalink)  
Antiguo 25/05/2008, 17:32
Usuario no validado
 
Fecha de Ingreso: abril-2008
Mensajes: 33
Antigüedad: 15 años, 11 meses
Puntos: 1
Ayuda con Pestañas, solas o tabs de noticias

hola estoy intentando hacer un tab de noticias y anda perfectamente lo que no logro hacer es que cuando se selecciona una opcion de la segunda solapa esta se quede seleccionada cuando muestro su contenido, por ej. en la segunda solapa tengo varios links, quiero que cuando se seleccione uno de la segunda solapa esta siga activa.

Espero su ayuda gracias.

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Tabs - presented by Kollermedia.at</title>

<style type="text/css">
/*Example for a Menu Style*/

.menu {background-color:#F7F7F7; height:10px; font:11px Arial, Helvetica, sans-serif;}
.menu ul {margin:0px; padding:0px; list-style:none; text-align:center;}
.menu li {display:inline; line-height:23px;}
.menu li a {text-decoration:none; padding:4px 5px 6px 5px; color:#055B7C;}
.menu li a.tabactive { font-weight:bold; background-color:white; color:#FF6600;}

</style>
<!--para mostrar una imagen de fondo con estilos es asi ej.background-image: url(solapas_fondo.jpg); -->

<script type="text/javascript">
/*Important Function to blend the tabs in and out*/
function blendoff(idname) {document.getElementById(idname).style.display = 'none';}
function blendon(idname) {document.getElementById(idname).style.display = 'block';}
</script>


<script type="text/javascript">
/*Function for our Tabmenu with 4 Tabs*/
function swichtabs(wert) {
if (wert=='1'){
document.getElementById('tablink1').className='tab 1 tabactive';
document.getElementById('tablink2').className='tab 2';
}else if (wert=='2'){
document.getElementById('tablink1').className='tab 1';
document.getElementById('tablink2').className='tab 2 tabactive';
}
}
</script>

</head>

<body>

<table width="250" border="0" align="center">
<tr>
<td style="text-align:center ; font-weight:bold; font-size:15px; .background-image: url(sombra_bottom_15.jpg); border-top:black solid 1px">- Ranking de Noticias - </td>
</tr>
<tr>
<td height="5">
</td>
</tr>
<tr>
<td valign="top">

<!--Start of the Tabmenu -->

<div class="menu">
<ul>
<li><a href="#" onclick="blendon('tabcontent1'); blendoff('tabcontent2'); swichtabs('1');" onclick="return false;" title="Ultimas Noticias" class="tabactive" id="tablink1">Ultimas Noticias. </a>
</li>

<li><a href="#" onclick="blendon('tabcontent2'); blendoff('tabcontent1');swichtabs('2');" onclick="return false;" title="Noticias Destacadas" class="tabactive" id="tablink2">Noticias Destacadas. </a></li>

</ul>
</div>
<!--End of the Tabmenu -->
</td>
</tr>
</table>



<!--Start Tabcontent 1 -->
<div style="display:block;" id="tabcontent1" >
<!--aca si quiero le pongo un link al cabezal Ej. <a href="index.php"> </a>--><? include("noticias_solapa_ultimas_noticias.php");?>
</div>
<!--End Tabcontent 1-->

<!--Start Tabcontent 2-->
<div style="display:none;" id="tabcontent2">
<? include("noticias_solapa_ultimas_destacadas.php"); ?>
</div>
<!--End Tabcontent 2 -->

</body>
  #2 (permalink)  
Antiguo 25/05/2008, 19:34
 
Fecha de Ingreso: febrero-2008
Mensajes: 578
Antigüedad: 16 años, 1 mes
Puntos: 3
Respuesta: Ayuda con Pestañas, solas o tabs de noticias

Al menos lo que estoy viendo según el ejemplo que enviaste funciona perfecto.
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:54.