Randomized image gallery without repeats

Question

I'm trying to make a gallery with about 20 images that are randomly selected from the folder images/random. This is the code I've come up with so far, the problem is that it shows the same image all over the gallery. Any help would be much appreciated.

var array = ['1.jpg', ..., 100.jpg ]
var path = "images/random"

var index = Math.floor(Math.random() * (array.length)),
image = array[index];

$(".random").attr("src", path + image);

HTML

<img class="random" src="" alt="">

Shuffle the array then grab an element. See http://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array — elclanrs, May 05 '14 at 22:04
Thank you! But once iv'e shuffled the array how do I cycle through it assigning different src attributes for all my images? — lasse kongo, May 05 '14 at 22:14

score 0 · Answer 1 · answered May 05 '14 at 22:05

0

If you just generate a random image and see if it's been used, you'll eventually get to a point where you're rejecting almost every image you generate, which is a massive waste. Instead, randomize your array of images and just go through it in order.

answered May 05 '14 at 22:05

Meredith

844
6
17

Randomized image gallery without repeats

1 Answers1