0

我目前正在为我的项目使用 Jquery Cycle 插件，并且幻灯片运行顺利。但是，我希望我的幻灯片在每次页面刷新时显示或以不同的图像开始。我不确定如何添加函数/脚本来实现这一点，或者是否可能。我是 JQuery 的新手，所以任何帮助将不胜感激！

脚本：

$(document).ready(function() {
    $('.slideshow').cycle({
         fx: 'fade',
         speed: 2500,
         timeout: 7000,
         prev: '#prev',
         next: '#next',
    });
});

我的 HTML：

<div class="slideshow">
    <img src="images/img_slide-1.jpg" />
    <img src="images/img_slide-2.jpg" />
    <img src="images/img_slide-3.jpg" />
</div>
4

2 回答 2

1

对这个插件进行一些快速研究（我以前从未使用过它），看起来有一个随机选项可以指定为 true。查看文档： http: //jquery.malsup.com/cycle/options.html（只是 ctrl-f 表示“随机”）。

如果您只是从随机的第一张图片中查看，然后是之后的连续幻灯片（如评论中所述），只需使用startingSlide：SLIDE_NUMBER_HERE，它应该可以工作，基于对文档的最少研究。

于 2012-09-25T03:12:56.037 回答
1

使用起始幻灯片选项

startingSlide: 0,     // zero-based index of the first slide to be displayed

要选择随机幻灯片，您需要获得这样的随机索引

var rand = Math.floor(Math.random() * $('.slideshow img').length);

然后，当您初始化循环时，将rand变量用作起始幻灯片。

$(document).ready(function() {
  var rand = Math.floor(Math.random() * $('.slideshow img').length);
  $('.slideshow').cycle({
    fx: 'fade',
    speed: 2500,
    timeout: 7000,
    prev: '#prev',
    next: '#next',
    startingSlide: rand
  });
});
于 2012-09-25T03:14:12.383 回答