2012-08-12 90 views
0

到目前爲止,我已經完成了將隨機化與我的高山畫廊整合在一起的驚人工作。但是現在我試圖讓它不會重複。有什麼建議麼?我查看了其他幾篇文章,但似乎無法正確地將其應用於我的代碼。我還在學習;你必須原諒我。如何在高山畫廊中不重複地顯示圖像?

這裏是我的頭代碼(JavaScript的):

var gallery = new Array(); 
gallery[0] = new Array("earlywork001.jpg","earlywork002.jpg","earlywork003.jpg"); 

function pickImageFrom(whichGallery) 
{ 
var idx = Math.floor(Math.random() * gallery[whichGallery].length); 
document.write('<a href="images/earlywork/' + gallery[whichGallery][idx] + '" class="highslide" onclick="return hs.expand(this, config1)"><img src="images/earlywork/' + gallery[whichGallery][idx] + '" width="140" height="140"></a>'); 
} 

這裏是我的身體的代碼(我只放了3使它簡單,但我實際上有50張):

<div class="highslide-gallery"><script language="javascript">pickImageFrom(0);</script> 
    <span class="highslide-heading"><i>Copyright © 2012 KD Neeley</i></span></div> 

<div class="highslide-gallery"><script language="javascript">pickImageFrom(0);</script> 
    <span class="highslide-heading"><i>Copyright © 2012 KD Neeley</i></span></div> 

<div class="highslide-gallery"><script language="javascript">pickImageFrom(0);</script> 
    <span class="highslide-heading"><i>Copyright © 2012 KD Neeley</i></span></div> 
+0

你想不重複的從一個頁面訪問到下一個頁面訪問隨機或只是在玩順序圖像按隨機順序給定頁面訪問內? – jfriend00 2012-08-12 06:56:35

+0

您可能需要跟蹤顯示在單獨數組中的圖像,並在選擇圖像時選取一個隨機圖像(如果它不在已顯示的數組中),顯示它或者選擇另一個隨機圖像。如果列表很小,則可以考慮在顯示所有圖像後清空陣列。 – 2012-08-12 06:58:45

+0

@SenthilKumar,壞主意。當您試圖將所有內容都顯示爲隨機時,請考慮50張圖片。未顯示的圖像越少,您將越浪費等待RNG達到符合條件的圖像的迭代次數。 Shuffle波紋管是正確的。 – 2012-08-12 08:19:24

回答

0

你可以將所有圖像添加到js數組。 製作一個從數組中獲取img的函數。 使用該功能決定顯示哪個圖像。

var images = ["img1.jpg","img2.jpg"]; 
var shownImages = []; 

function randomimg(images,shownImages){ 

    //select a random number from with in the range of the image array 
    rand = Math.floor((Math.random()*images.length())+1); 
    //store the displayed image in the shown array and remove it from images 
    shownImages.unshift(images.splice(rand,rand+1)); 

    //if the image array is empty 
    //I guess we would like to show the images over again so resetit 
    //The commented out part is only necessary if you want to show 
    //images in a loop 
    /*if(images.length == 0){ 
    images = shownImages; 
    shownImages = []; 
    }*/ 

    //return the image to show this time. 
    return shownImages[0]; 
} 
+0

它對您有幫助嗎? – 2012-08-12 08:06:32

+0

對不起巴勃羅,我一直在試圖用我的代碼實現這一點,似乎無法讓它工作。有什麼方法可以幫我看看它會是什麼樣子? – Mike 2012-08-12 19:48:23

+0

這是我的原始頁面:http://kristengandy.com/kdneeley/earlywork_page1.htm – Mike 2012-08-12 19:50:36

0

添加洗牌陣列原型

Array.prototype.shuffle=function(){ 
    var i = len = this.length;  
    while (i--) { 
     var r = Math.round(Math.random(len)); 
     var t = this[i]; 
     this[i] = this[r]; 
     this[r] = t; 
    } 
    return this; 
} 

然後你就可以使用隨機方法與任何陣列:

gallery.shuffle(); // this shuffles the array 

演示:http://jsfiddle.net/W75Kw/1/

更新爲要求:使用您發佈的代碼:

var gallery = new Array(); 
gallery[0] = new Array("earlywork001.jpg","earlywork002.jpg","earlywork003.jpg"); 
gallery[0].shuffle(); // randomize array 

function pickImageFrom(whichGallery) { 
    var img = gallery[whichGallery].pop(); // extracts element from array 
    document.write('<a href="images/earlywork/' + img + '" class="highslide" onclick="return hs.expand(this, config1)"><img src="images/earlywork/' + img + '" width="140" height="140"></a>'); 
} 
+0

這似乎是最簡單的方法,但我似乎無法融入我的代碼。我希望能夠在頁面的某些區域回憶圖像,而不是並排。你能告訴我它會是什麼樣子嗎? – Mike 2012-08-12 19:40:10

+0

這裏是我的原始頁面:http://kristengandy.com/kdneeley/earlywork_page1.htm – Mike 2012-08-12 19:51:03

+0

我在哪裏把gallery.shuffle();? – Mike 2012-08-13 04:17:24