隨機顯示一組圖像？

Question

我有一些圖片：

我想使圖像以隨機的順序每次有人刷新頁面。

基本上，圖像應切換點每次有人刷新。

我該怎麼做？我已經搜索，但似乎無法找到多少。

我也希望圖像鏈接到一個網站。

順便說一句，我用我的頁面佈局的Smarty。

Answer 1

您可以使用數組來做到這一點。但是，您必須對此陣列使用shuffling方法。然後，您可以瀏覽新的隨機數組以創建HTML字符串。你可以這樣來做：

//https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array 
 
Array.prototype.shuffle=function(){var i=this.length,j,temp;if(i==0)return this;while(--i){j=Math.floor(Math.random()*(i+1));temp=this[i];this[i]=this[j];this[j]=temp}return this} 
 

 
var images = [ 
 
    {url: "1.gif", link: "http://www.google.com"}, 
 
    {url: "2.gif", link: "http://www.youtube.com"}, 
 
    {url: "3.gif", link: "http://www.facebook.com"} 
 
]; 
 
var imagesShuffle = images.shuffle(); 
 

 
var elementParent = document.querySelector("#images"); 
 

 
imagesShuffle.forEach(function(image){ 
 
    elementParent.innerHTML += '<div class="imageItem"><a href="'+image.link+'"><img src="'+image.url+'" alt="'+image.url+'"></a></div>' 
 
})

#images{background:#BC4F0A; width:200px} 
 

 
#images .imageItem {border-bottom:1px solid black} 
 

 
#images .imageItem a {display:block;padding:15px 10px; }

<div id="images"></div>

Answer 2

您可以使用這樣的事情：

<script type="text/javascript"> 


window.onload = function() { 
    randomlinks(); 
}; 

function randomlinks(){ 
    var myrandom=Math.round(Math.random()*9) 
    var links=new Array() 
    links[0]="http://www.iamurl.xyz/1.jpg" 
    links[1]="http://www.iamurl.xyz/2.jpg" 
    links[2]="http://www.iamurl.xyz/3.jpg" 
    links[3]="http://www.iamurl.xyz/44.jpg" 
    links[4]="http://www.iamurl.xyz/43.jpg" 
    links[5]="http://www.iamurl.xyz/12.jpg" 
    links[6]="http://www.iamurl.xyz/11.jpg" 
    links[7]="http://www.iamurl.xyz/11.jpg" 
    links[8]="http://www.iamurl.xyz/133.jpg" 
    links[9]="http://www.iamurl.xyz/112.jpg" 
    links[10]="http://www.iamurl.xyz/111.jpg" 


    window.location=links[myrandom] 
} 
</script>