我有一个简单的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>
我现在想做的是让它们随机化。由于此幻灯片显示在我的页面的页眉中,因此每次用户导航到不同的页面时,幻灯片显示都会从头开始。
我想让它以随机的顺序显示图像。
任何帮助都是最好的!
发布于 2011-05-20 06:48:46
尝试使用此逻辑
<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();
参考文献
发布于 2011-05-20 07:05:47
我在http://yelotofu.com/labs/jquery/snippets/shuffle/jquery.shuffle.js上找到的jQuery插件可能可以做到这一点。它会对选定的所有元素进行混洗。这里还有一个演示:http://yelotofu.com/labs/jquery/snippets/shuffle/demo.html。
用法类似于$('#imagediv').shuffle();
https://stackoverflow.com/questions/6068317
复制相似问题