带有随机超时的jQuery幻灯片显示

我想在我的网站的主页上设置多个迷你幻灯片。如果你现在去那里（http://www.element17.com/），你会看到有六个图像分类，目前一些PHP从数据库中抓取五个随机图像，并将它们全部放在“幻灯片”div中。这似乎是我见过的jQuery幻灯片插件中最流行的设置。我希望这六个中的每一个能够通过五个随机图像进行幻灯片播放。带有随机超时的jQuery幻灯片显示

但是，我希望每张幻灯片的超时时间都是随机的，以便六个幻灯片不会相互同步。

我已经看到Cycle插件支持这个，但我一直没有成功实现它。我不需要花哨的转换（只是淡入淡出），我不需要任何其他功能，所以看起来这可能是最简单的做法。虽然我没有很多jQuery的经验，所以我希望有人能够让我开始？

非常感谢！

来源

2011-04-04 NaOH

Cycle插件出了什么问题？您应该可以像这样使用它（未经测试）：

//time in ms 
var minTime = 2000; 
var maxTime = 5000; 
$(document).ready(function() { 
    $('.slideshow').each(function(ind) { 
     $(this).cycle({ 
      timeout:Math.floor((Math.random()*(maxTime-minTime))+minTime), 
      speed:1000 
     }); 
    }); 
});

只需根据需要更改最小和最大时间。

来源

2011-04-04 08:55:12 shanethehat

这几乎完美！我怎样才能将你的超时与那个Cycle插件的其他参数结合起来？这似乎是当我添加另一个参数（如速度）它打破幻灯片。 – NaOH 2011-04-04 09:25:37

我编辑了我的答案，包括设置速度。如果您想要添加更多参数，请确保除最后一个之外的所有参数都后接逗号。 – shanethehat 2011-04-04 09:48:08

啊，看看你的页面源代码，出了什么问题是你的超时线有点不对。它缺少'Math.floor'，并且底层函数的右括号放置在下一行。 – shanethehat 2011-04-04 09:57:10

带有随机超时的jQuery幻灯片显示

回答

相关问题