See also Random Image - Fixed 2
When the page loads a set number of randomly chosen images is displayed.
Set how many randomly chosen images you want to show at variable quantity
Create the same number of image places using the name "picn" where n is an ordinal number starting at zero.
To include the link function add onclick="goHere(n)" to the images tag where n is the same ordinal number used in the name.
Example
<img name="pic0" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(0)">
<img name="pic1" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(1)">
<HTML>
<HEAD>
<TITLE>Random Image - Fixed</TITLE>
<script type="text/javascript">
<!--
// Jeff
// www.huntingground.freeserve.co.uk
myImages = [
["pic01.jpg","page1.htm"],
["pic02.jpg","page2.htm"],
["pic03.jpg","page3.htm"],
["pic04.jpg","page4.htm"],
["pic05.jpg","page5.htm"],
["pic06.jpg","page6.htm"],
["pic07.jpg","page7.htm"],
["pic08.jpg","page8.htm"],
["pic09.jpg","page9.htm"],
["pic10.jpg","page10.htm"] // no comma at the end of last index
]
quantity=5 // how many to choose
var preloadImages=new Array()
for (i=0;i<myImages.length;i++) {
preloadImages[i]=new Image()
preloadImages[i].src=myImages[i]
}
function randomise(){
total=myImages.length // range
numbersRange=new Array()
selectedNum=new Array()
for(n=0;n<=total;n++){
numbersRange[n]=n
}
for(p=0;p<quantity;p++){
rndnum=Math.floor(Math.random()*(total))
selectedNum[p]=numbersRange.splice(rndnum,1)
total--
}
for(var i=0;i<selectedNum.length;i++){
document.images["pic"+i].src=myImages[selectedNum[i]][0]
}
}
function goHere(n){
//location=myImages[selectedNum[n]][1]
window.open(myImages[selectedNum[n]][1])
}
// add onload="randomise()" to the opening BODY tag if required
// -->
</script>
</HEAD>
<BODY onload="randomise()">
<h1>Random Image - Fixed</h1>
<center>
<img name="pic0" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(0)">
<img name="pic1" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(1)">
<img name="pic2" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(2)">
<img name="pic3" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(3)">
<img name="pic4" src="spacer.gif" alt="" style="width:75px;height:50px" onclick="goHere(4)">
</center>
</BODY>
</HTML>