2012-03-12 90 views
0

我需要一個多個隨機圖像旋轉器。隨機多個圖像旋轉器 - 頁面刷新時隨機顯示圖像的屏幕?

我有整個頁面的整個屏幕上的多個120px×100px的標誌,我想要做的是當頁面刷新時,標誌隨機圍繞屏幕旋轉,所以一個標誌不在同一個位置時間。

另外它不能重複的標誌,因此該標誌不能重複在屏幕上?

任何人都可以幫助我嗎?

我認爲它可能就像jQuery一樣簡單,給所有的標誌都包含在一個類中的div,然後刷新它只是隨機混合它們呢?

我累了的每個教程只考慮屏幕上顯示的一個圖像!

謝謝

回答

0

只需使用一些隨機數來移動元素。

Javascript的Math.random將爲此做好,然後迭代所有圖像並在頁面加載時移動它們。

這裏是一個非常簡單的例子:

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

這裏有一個FIDDLE

+0

這聽起來很完美,謝謝,但我不能讓它在所有的工作爲我的網站: - http://adoogle.co .uk/full-random.html任何想法爲什麼?謝謝 – Paul 2012-03-12 21:23:13

+0

任何人都知道爲什麼它可能不適用於我的網站上的代碼?當我刷新圖像消失,我只是得到加載圖標?謝謝 – Paul 2012-03-13 14:48:25

+0

我真的不知道,可能是因爲調用函數時圖像沒有加載,或者可能是很多其他的東西?代碼只是作爲一個如何選擇隨機元素的一般示例,並且您將不得不使其適合您的特定化妝等。 – adeneo 2012-03-13 14:59:42