como agregar tabs a unos botones

[WinderJerter]

hola que tal, no se si este sea el lugar indicado para poner esto, pero bueno este es mi problema,,,

lo que pasa esque en mi web tengo un navbar tipo pestañas, y lo que quiero hacer es utilizar jquery para que no tenga que cargar la web otra vez si no para que haga un tipo efecto como este ejemplo

http://webfx.eae.net/dhtml/tabpane/tabpane.html

mi pregunta es ¿como le puedo hacer para tener una tabs asi con base a mi navbar?

saludos y gracias de antemano,,, aqui esta la url de mi web http://www.pk-network.co.cc/

[JavierB]

Hola WinderJerter

Muevo tu tema al foro de Frameworks desde Javascript.

Saludos,

[Rosencrantz]

Revisa este tutorial, es muy bueno

http://yensdesign.com/2008/12/create...enu-in-jquery/

[WinderJerter]

Iniciado por Rosencrantz

Revisa este tutorial, es muy bueno

http://yensdesign.com/2008/12/create...enu-in-jquery/

muchas gracias bro , lo voy a provar haber que tal

saludos!!!

[mayid]

Una de dos:

usas ajax para cargar contenidos de tabs.

o usas un prefabricados de tabs jquery que te cargue todo desde un principio y lo muestre al hacer click.

[WinderJerter]

que tal mayid, oye no me ppodrias par un ejemplo de ajax para cargar contenidos de tabs

saludos

[mayid]

Fijate aca:

http://diseniomadreselva.com.ar/comunidad.php

[mayid]

Te lo transcribo:

// AJAX TABS
var pageUrl = new Array();
pageUrl[1] = "comunidad/tab1.html";
pageUrl[2] = "comunidad/tab2.html";
pageUrl[3] = "comunidad/tab3.html";
pageUrl[4] = "comunidad/tab4.html";
pageUrl[5] = "comunidad/mayid.html";
function loadTab(id)
{
if (pageUrl[id].length > 0)
{
$("#preloader").show();
$.ajax(
{
url: pageUrl[id],
cache: false,
success: function(message)
{
$("#tabcontent").empty().append(message);
$("#preloader").hide();
}
});
}
}

$(document).ready(function()
{
$("#preloader").hide();

$("#tab1").click(function()
{
loadTab(1);
});

$("#tab2").click(function()
{
loadTab(2);
});

$("#tab3").click(function()
{
loadTab(3);
});

$("#tab4").click(function()
{
loadTab(4);
});
$("#tab5").click(function()
{
loadTab(5);
});
});

El HTML:

<div class="navcontainer">
<ul>
<li><a id="tab1" href="#tabcontent">Alan</a></li>
<li><a id="tab2" href="#tabcontent">Pick</a></li>
<li><a id="tab3" href="#tabcontent">Gabi</a></li>
<li><a id="tab4" href="#tabcontent">Tami</a></li>
<li><a id="tab5" href="#tabcontent">Mayid</a></li>
<li><a id="tab5" href="./index.php">Volver</a></li>
</ul>
</div><!-- fin tabs -->

[WinderJerter]

muchas gracias bro,,, al rato lo pruebo haber que tal y te cuento

saludos!!!