0

メインページに表示されるより多くのタブを備えたスライダーがあるので、オーバーフロー非表示のulセットにそれらを配置することを考えています。最後のタブがアクティブになり、[次へ] をクリックすると、次のタブは表示されず、スライド自体 (一番上) が表示されます。

最後に表示されたタブがアクティブ (現在のクラス) になり、[次へ] をクリックすると、次の非表示のタブが表示されます。基本的に、タブ 1 ～ 5.5 からタブ 2 ～ 6.5 に移動します。

タブ自体をクリックしてコンテンツを表示することもできるため、矢印の前と次をクリックすると2つの機能が必要になります(前をクリックするとタブがスクロールバックし、次をクリックすると非表示のタブが表示されます)。

これらの 2 つの関数を作成しようとしましたが (以下のコードを参照)、機能していません。

デモ: http://jsfiddle.net/epnDK/1/

  1. 次と前の矢印をクリックしたときの機能

    $('.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');
  }
});

  2. 現在のタブの次のタブを表示する

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

1 に答える 1

0

2つの問題があります。

  1. CSSクラスを適切に取得していません。

    if ($(this).hasClass('coda-nav-left')) {

    適切な要素を削除しません。

    $('.coda ul').remove('li:last');

  2. そうではないと思いますcurrentが$current。

于 2012-10-17T09:37:06.857 に答える