Jquery幻灯片加载随机随机图像顺序

我有一个简单的Jquery幻灯片，它一个接一个地淡化图像列表。

<script type="text/javascript">
$(function(){
    $('.fadein img:gt(0)').hide();
setInterval(function(){
  $('.fadein :first-child').fadeOut(3000)
     .next('img').fadeIn(3000)
     .end().appendTo('.fadein');}, 
  3000);
});
</script>

我现在想做的是使它们随机化。由于此幻灯片位于我的页面标题中，因此每次用户导航到其他页面时，幻灯片都会重新从头开始。

我想使图像以随机顺序显示。

任何帮助都会很棒！

尝试使用这个逻辑

<body onload="document.body.background = '/images/img'+Math.floor(Math.random()*4)+'.jpg';" />

或尝试使用此功能

$.fn.randomImage = function (){
var $imageNumber = 8, 
// Set the amount of images in the Sprite
$height = $('> div', this).innerHeight(),
$random_num = Math.random() * $imageNumber - 1,
$multiple = Math.round($random_num),
$random = $height * $multiple
jQuery('.image').css( 
{'background-position' : '0px -' + $random + 'px',  'display' : 'block' } 
)};

然后

jQuery('#image-container').randomImage();

参考

随机图像
另一个

我在

http://yelotofu.com/labs/jquery/snippets/shuffle/jquery.shuffle.js 找到的jQuery插件可能会解决问题。它会随机排列所有选定的元素。这里还有一个演示：http://yelotofu.com/labs/jquery/snippets/shuffle/demo.html。

用法就像$('#imagediv').shuffle();

相关内容

最新更新

热门标签：