随机显示2组不同的图像

时间:2013-11-24 09:58:03

标签: javascript jquery-ui jquery

我有2套不同的图像。

首先设置为: img1.jpg,img2.jpg,img3,jpg

第二集是: imga.jpg,imgb.jpg,imgc.jpg

我还有三个不同的div#one,#tw,#three。

每组图像必须遵循顺序。 img1.jpg必须嵌入div #one,img2.jpg必须嵌入div #two& img3.jpg必须嵌入div #three。

第二组图像也必须发生同样的事情。但图像集会随机变化。

我想随机显示图像集。意味着,当用户登录时,他们可能会看到第一组图像,刷新后他们可能会看到第二组图像。

注意:我不允许使用css'background-image'

提前致谢

1 个答案:

答案 0 :(得分:0)

您可以尝试使用Math.random()动态决定图像集,然后使用随机选择的图像集来显示图像:

var arr1 = ["1.jgp", "2.jgp", "3.jgp"];
var arr2 = ["4.jgp", "5.jgp", "6.jgp"];

var currentArr = Math.random() < 0.5 ? arr1 : arr2;

$.each(currentArr, function(i, val){
  $('#yourContainer').append('<img src="'+val+'"/>');
});

EDIT1:

如果您有两个以上的数组,您可以尝试这样的事情:

var arrays = [arr1, arr2, ...];
var currentArr = arrays[Math.floor(Math.random() * arrays.length)];