Gracias kreil, de hecho ya tengo este codigo
JavaScript
:
Código:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() {
$(".contenido_tab").hide(); //Ocultar capas
$("ul.tabs li:first").addClass("activa").show(); //Activar primera pestaña
$(".contenido_tab:first").show(); //Mostrar contenido primera pestaña
// Sucesos al hacer click en una pestaña
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("activa"); //Borrar todas las clases "activa"
$(this).addClass("activa"); //Añadir clase "activa" a la pestaña seleccionada
$(".contenido_tab").hide(); //Ocultar todo el contenido de la pestaña
var activatab = $(this).find("a").attr("href"); //Leer el valor de href para identificar la pestaña activa
$(activatab).fadeIn(); //Visibilidad con efecto fade del contenido activo
return false;
});
});
</script>
y luego lo coloco con el siguiente:
Código:
<ul class="tabs">
<li><a href="#tab1">Opción 1</a></li>
<li><a href="#tab2">Opción 2</a></li>
<li><a href="#tab3">Opción 3</a></li>
</ul>
<div class="contenedor_tab">
<div id="tab1" class="contenido_tab">
CONTENIDO 1
</div>
<div id="tab2" class="contenido_tab">
CONTENIDO2
</div>
<div id="tab3" class="contenido_tab">
CONTENIDO3
</div>
</div>
<div style="clear:both;">
</div>
Efectivamente Muestra y Oculta cuando se cambia de Seleccion, el detalle es que yo quiero que cuando no se haya seleccionado nada aun no aparezca ningun contenido todavia, hasta que yo seleccione alguno, sabe alguien como lograr eso?
Gracias.