O jTabk é um plugin que criei para auxiliar a animação em Tabs.
Pode utilizar também setas para passar as Tabs, segue abaixo o dois links, com e sem setas.

É bem simples sua utilização, só é preciso seguir umas regras de formatação de classes. Veja o link da aplicação DEMO

Agora veja o link com setas: DEMO

Navegadores: IE7+ / FF4+ / Chrome / Safari / Opera

Pra chamar a função identifique primeiro o ID do Tab que irá ser utilizado.

$("#jtabk").jtabk();

Vamos ver agora o HTML:

<div id="jtabk">
  <ul id="jtabk-menu">
      <li>Tab 1</li>
      <li>Tab 2</li>
      <li>Tab 3</li>
      <li>Tab 4</li>
  </ul>
  <div class="jtabk-panel jtabk-active">1 There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</div>

  <div class="jtabk-panel">2 If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.</div>

  <div class="jtabk-panel">3 All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.</div>

  <div class="jtabk-panel">4 It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop.</div>
</div>

Vamos para as partes obrigatórias do Plugin:
– O ID jtabk-menu e na lista UL e as classes jtabk-panel no corpo da Tab são obrigatórias.
- A classe jtabk-active marca a Tab atual. (É fundamental essa classe no código; você pode colocar ela em qualquer Tab, sendo assim a primeira a ser mostrada.)

 

 

DOCUMENTAÇÃO
1. Para ativar os setas você precisa adicionar alguns parâmetros no Plugin:

$("#jtabk").jtabk({
    arrows: {left: "", right: ""}
});

1.2. Nos parâmetros você pode colocar ID ou class, no caso foram utlizados IDs, veja exemplo:

$("#jtabk").jtabk({
    arrows: {left: "#left", right: "#right"}
});

Veja o HTML:

<div id="setas">
    <a href="javascript:;" id="left"><img src="imgs/left.png"></a>
    <a href="javascript:;" id="right"><img src="imgs/right.png"></a>
</div>

Segue o Código Completo das Tabs simples: DEMO
Download do código Tab: LINK

Segue o Código Completo das Tabs com Setas: DEMO
Download do código Tab com setas: LINK

DOWNLOAD do jTabk Versão: 1.0
Minified e Uncompressed Code

Navegadores: IE7+ / FF4+ / Chrome / Safari / Opera