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 的答案，将选项输出转换为一个函数，并简单地使用每个序列实例的计数器调用该函数。然后使用他答案的第二部分来初始化每个序列滑块，这很有效。

这就是我现在的工作：

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 回答