0

我用 responsiveslides.js 创建了一个滑块。它包含 5 个不同的图像幻灯片。

我通常可以分配一个超时时间，例如 4000 毫秒，但它会分配给滑块的每个图像。

我想为每张图片幻灯片分配不同的超时时间。例如：

slide 1: timeout = 10000
slide 2: timeout = 2000
slide 3: timeout = 4000
slide 4: timeout = 4000
slide 5: timeout = 2000

我怎样才能得到它？可能吗？非常感谢您的帮助，并为我糟糕的英语感到抱歉。

我按照 Timctran 的建议编辑了代码，但我做错了。你能帮我找出这段代码有什么问题吗？

我尝试按照您的建议更改代码。我没有 javascript 代码经验，所以我做错了，滑块不再工作，所以我恢复到旧版本。这是我修改代码的方式：

 // Array to enter timeout values.
        var desiredTimeouts = [10000, 2000, 4000, 4000, 2000];
    // Auto cycle
    if (settings.auto) {
        startCycle = function (i) {
            rotate = setTimeout(function () {
          // Clear the event queue
          $slide.stop(true, true);

          var idx = index + 1 < length ? index + 1 : 0;

          // Remove active state and set new if pager is set
          if (settings.pager || settings.manualControls) {
            selectTab(idx);
          }

          slideTo(idx);
        startCycle(index);
    }, desiredTimeout[i]);
};

      // Init cycle
      startCycle(index);
    }

    // Restarting cycle
    restartCycle = function () {
      if (settings.auto) {
        // Stop
        clearTimeout(rotate);
        // Restart
        startCycle(index);
      }
    };

任何纠正代码的帮助将不胜感激。谢谢！

4

2 回答 2

1

responsiveslides.js被调用函数中有一个函数rotate（第 232 行）。在该部分代码中，进行您在此处看到的任何更改：

// Array to enter timeout values.
var desiredTimeouts = [10000, 2000, 4000, 4000, 2000];
// Auto cycle
if (settings.auto) {
  startCycle = function (i) {
    rotate = setTimeout(function () {
      // Clear the event queue
      ...
      slideTo(idx);
      startCycle(index);
    }, desiredTimeout[i]);
  };
  // Init cycle
  startCycle(index);
}
...
     clearTimeout(rotate);
     startCycle(index);
...
     clearTimeout(rotate);

对脚本所做的更改摘要：

  1. 添加包含desiredTimeouts.
  2. 改为。setInterval_setTimeout
  3. startCycle在函数末尾添加调用。
  4. 将两个实例更改clearInterval为clearTimeout
  5. 作为参数index调用startCycle.
于 2014-10-01T13:21:20.167 回答
0

感谢 Timctran，我有了最终的解决方案。

打开 responsiveslides.js 文件并转到第 227 行（responsiveslides.js 版本 1.54）。

使用以下代码更正现有代码。在 var desiredTimeout 中插入所需的超时，以逗号分隔。

// Array to enter timeout values.
        var desiredTimeout = [10000, 4500, 4500, 4500];

    // Auto cycle
    if (settings.auto) {
        startCycle = function (i) {
            rotate = setTimeout(function () {
                // Clear the event queue
                $slide.stop(true, true);

                var idx = index + 1 < length ? index + 1 : 0;

                // Remove active state and set new if pager is set
                if (settings.pager || settings.manualControls) {
                    selectTab(idx);
                }

          slideTo(idx);
          startCycle(index);
          }, desiredTimeout[i]);
        };

      // Init cycle
      startCycle(index);
    }

    // Restarting cycle
    restartCycle = function () {
      if (settings.auto) {
        // Stop
        clearTimeout(rotate);
        // Restart
        startCycle(index);
      }
    };

    // Pause on hover
    if (settings.pause) {
      $this.hover(function () {
        clearTimeout(rotate);
      }, function () {
        restartCycle();
      });
    }
于 2014-10-07T09:43:15.947 回答