2

カスタム投稿タイプをページ上のスライダーに変えるWordPressサイトで作業しています。スライダーにSequence.jsを使用していますが、次の問題で複数のスライダーを手動で作成できます。

//sequence slider options to be used by slider1
var options0 = {
    sartingFrameID: 1,
    cycle: true,
    autoPlay: false,
    nextButton: '.next0',
    prevButton: '.prev0',
    fallback: {
        theme: "fade",
        speed: 100
    }
}

//slider1
var sequence0 = $(".slideContainer0").sequence(options0).data("sequence");

//sequence slider options to be used by slider2
var options1 = {
    sartingFrameID: 1,
    cycle: true,
    autoPlay: false,
    nextButton: '.next1',
    prevButton: '.prev1',
    fallback: {
        theme: "fade",
        speed: 100
    }
}

//slider2
var sequence1 = $(".slideContainer1").sequence(options1).data("sequence");

どうすればこれを合理化できますか？また、作成される投稿ごとにスライダーが作成されるように動的にしますか？どんな助けでも大歓迎です。

編集-作業回答を追加

最初の部分では、以下のCymenからの回答を使用して、オプションの出力を関数に変換し、シーケンスインスタンスごとにカウンターを使用して関数を呼び出すだけです。次に、彼の回答の2番目の部分を使用して、各シーケンススライダーを初期化し、処理を行います。

これは私が今働いていることです：

function options(number) {
    return {
        startingFrameID: 1,
        cycle: true,
        autoPlay: false,
        nextButton: '.next' + number,
        prevButton: '.prev' + number,
        fallback: {
            theme: "fade",
            speed: 100
        }
    };
}

var count = 0;
$('.slideContainer').each(function() {
    var sequence = $(this); 
    sequence.sequence(options(count)).data('sequence');
    count++;
});
4

1 に答える 1

1

私はシーケンスを使用していませんが、あなたの投稿から、番号の増分でオプションオブジェクトを再作成できるようにしたいと思います。したがって、次のようなことができます。

function options(number) {
  return {
   startingFrameID: 1,
    cycle: true,
    autoPlay: false,
    nextButton: '.next' + number,
    prevButton: '.prev' + number,
    fallback: {
        theme: "fade",
        speed: 100
    }
  };
}

次に、次のように使用します。

$(target).sequence(options(0)).data("sequence");

またはあなたの特定の例では：

//slider1
var sequence0 = $(".slideContainer0").sequence(options(0)).data("sequence");

//slider2
var sequence1 = $(".slideContainer1").sequence(options(1)).data("sequence")

そして、あなたが話していることを行うには、すべてのシーケンスに同じクラスを言うように与えてから、次のcustom-sequenceようにします。

var count = 0;
$('.custom-sequence').each(function() {
  var sequence = $(this);
  sequence.sequence(options(count)).data('sequence');
  count++;
});

それはうまくいくかもしれないし、うまくいかないかもしれません-それが何をしているのか私にははっきりしていません.data('sequence')。

于 2013-02-13T23:12:51.427 に答える