Show hidden tabs from slider
<p>I have a slider with more tabs then visible on the main page, so my idea is to put them in a ul set at overflow hidden.
Once the last tab is active and you click next, the next tab is not displayed, the slide itself (on top) is displayed. </p>

<p>What should happen once the last visible tab is active (current class) and click next, the next hidden tabs should be displayed. Basically you go from seeing tab 1 to 5.5 to tab 2 to 6.5.</p>

<p>As you can also click a tab itself to display it's content, I would need 2 functions, one when clicking the arrows prev and next (when clicking prev the tabs should scroll back and clicking next the hidden one's should become visible).</p>

<p>I've tried to make these 2 functions (see code below) but they are not working.. Any ideas, is this even possible?</p>

<p>Demo: <a href="http://jsfiddle.net/epnDK/1/" rel="nofollow">http://jsfiddle.net/epnDK/1/</a></p>

<ol>
<li><p>The function when clicking next and prev arrows</p>

<pre><code>$('.coda-nav-left, .coda-nav-right').click(function(e) {
  if (class == 'coda-nav-left') {
    $('.coda ul li').remove('.coda ul li:last');
  } else {
    $('.coda ul li'). remove('.coda ul li:first');
  }
});
</code></pre></li>
<li><p>Display the next tabs after the current one</p>

<pre><code>function current() {
  var $current = $('.coda-nav ul li a.current');
  if (current) {
    //show current in the center and 2 tabs before and after current
  }
}
</code></pre></li>
</ol>
