Случайное вращение нескольких изображений - отображать экран изображений в случайном порядке при обновлении страницы?

Question

Мне нужен ротатор с несколькими случайными изображениями.

У меня есть полная страница с несколькими логотипами размером 120px X 100px по всему экрану, и я хочу, чтобы при обновлении страницы логотипы вращались вокруг экрана случайным образом, поэтому один логотип все время не находится в одном и том же положении. .

Также нельзя дублировать логотипы, поэтому логотип не может повторяться на экране?

Может ли кто-нибудь помочь мне здесь?

Я подумал, что это может быть так просто, как немного jQuery, дающий div, что все логотипы содержатся в классе, а затем при обновлении он просто смешивает их все случайным образом?

В каждом утомленном учебнике учитывается только ОДНО изображение, отображаемое на экране!

Спасибо

Answer 1

Просто используйте несколько случайных чисел для перемещения элементов.

Math.random в Javascript подойдет для этого, затем итерирует по всем изображениям и немного их перемещает при загрузке страницы.

Вот очень простой пример:

$('.images').each(function() {
    randomElm = $('.images').get(Math.floor(Math.random()*10));
    randomElm.parentNode.insertBefore(this, randomElm);
});

Вот FIDDLE