Random Image

Show a randomly selected image when the page loads.
The first time the page is loaded a list of randomly selected images is created from the main array and the first image in the list is shown.
Each time the page is reloaded the next image in this list is shown, once all the images have been used a new list of randomly selected images is created.

The following example is set to randomly select 5 images out of 8.
The numbers shown represent the index number in the imgArray.

The order of the current randomly selected images are The current index number being referenced is The value at imgArray[] is

The above thumbnails are for reference only.
Remember that javascript counts from zero.

Each imgArray index allows for 3 entries, the image src, image alt text, and url.
imgArray[n]=new Array("pic1.jpg","Picture 1","URL")

If a url is not required leave the quotes empty.
imgArray[n]=new Array("pic1.jpg","Picture 1","")

By changing the value of variable howMany=imgArray.length to a number less than the length of imgArray you can set the script to only select from that number of images.

<script type="text/javascript">
<!--
// Jeff
//www.huntingground.freeserve.co.uk

imgArray=new Array()
imgArray[0]=new Array("pic01.jpg","Pic 1","url")
imgArray[1]=new Array("pic02.jpg","Pic 2","url")
imgArray[2]=new Array("pic03.jpg","Pic 3","url")
imgArray[3]=new Array("pic04.jpg","Pic 4","url")
imgArray[4]=new Array("pic05.jpg","Pic 5","url")
imgArray[5]=new Array("pic06.jpg","Pic 6","url")
imgArray[6]=new Array("pic07.jpg","Pic 7","url")
imgArray[7]=new Array("pic08.jpg","Pic 8","url")

totalRange = imgArray.length // numbers range to select from
howMany = 5 // how many to select

function generate(){
total=imgArray.length
oSelect=howMany
numbersRange=new Array() // array to hold numbers to select from.
selectedNum=new Array() // array to hold selected numbers

for(n=0;n<total;n++){ // create list of numbers to choose from
numbersRange[n]=n // start of numbers to choose from
}

for(p=0;p<oSelect;p++){ // generate a random number for oSelect times
rndnum=Math.floor(Math.random()*total)
selectedNum[p]=numbersRange.splice(rndnum,1) // add to selectedNum array and remove from numbersRange array
total--
}
showSelectedNumber()
}

count=0
function showSelectedNumber(){
if(count==selectedNum.length){
count=0
generate()
return
}

document.mypic.src=imgArray[selectedNum[count]][0] // image src
document.mypic.alt=imgArray[selectedNum[count]][1] // image alt text
imgUrl=imgArray[selectedNum[count]][2]

count++

saveDataToCookie()
}

function goHere(){
if(imgUrl==""){
return
}
location.href=imgUrl
}

cookieName="random_img"
expdays=365

// An adaptation of Dorcht's cookie functions.

function setCookie(name, value, expires, path, domain, secure){
if (!expires){expires = new Date()}
document.cookie = name + "=" + escape(value) +
((expires == null) ? "" : "; expires=" + expires.toGMTString()) +
((path == null) ? "" : "; path=" + path) +
((domain == null) ? "" : "; domain=" + domain) +
((secure == null) ? "" : "; secure")
}

function getCookie(name) {
var arg = name + "="
var alen = arg.length
var clen = document.cookie.length
var i = 0;
while (i < clen) {
var j = i + alen
if (document.cookie.substring(i, j) == arg){
return getCookieVal(j)
}
i = document.cookie.indexOf(" ", i) + 1
if (i == 0) break
}
return null
}

function getCookieVal(offset){
var endstr = document.cookie.indexOf (";", offset)
if (endstr == -1)
endstr = document.cookie.length
return unescape(document.cookie.substring(offset, endstr))
}

function deleteCookie(name,path,domain){
document.cookie = name + "=" +
((path == null) ? "" : "; path=" + path) +
((domain == null) ? "" : "; domain=" + domain) +
"; expires=Thu, 01-Jan-00 00:00:01 GMT"
}

function saveDataToCookie(){
var expdate = new Date ()
expdate.setTime (expdate.getTime() + (expdays*24*60*60*1000)); // expiry date
data=selectedNum+","+count
setCookie(cookieName,data,expdate)
}

function getCookieData(){
inf=getCookie(cookieName) // check for cookie
if(!inf){ // if no cookie
generate()
return
}

cookieData=inf
cookieData=cookieData.split(",")

if((cookieData.length-1)!=howMany){ // check cookie length against howMany value, if mismatch
deleteCookie(cookieName)
generate()
return
}

selectedNum=new Array() // recreate the array
for(i=0;i<cookieData.length-1;i++){
selectedNum[i]=cookieData[i] // repopulate the array
}
count=cookieData[cookieData.length-1] // set count
showSelectedNumber()
}

// add onload="getCookieData()" to the opening BODY tag

// -->
</script>

<img name="mypic" src="" width="300" height="200" onclick="goHere()" style="cursor:hand;cursor:pointer">