RANDOM IMAGE on page reload
A new image shows when someone returns to this page or when the page is reloaded. We have used a cylce of 5 images for this demo.
This is the script that goes into the head of the document, place it just before the closing </head> tag.
<script type="text/javascript"> <!-- function displayRandomImage(imageName,array){
document.images[imageName].src=array[new Date().getTime()%array.length]; } // load this line with your image file names and paths
urls=["../templatepics/beauty/beauty_small.jpg","../templatepics/attorneygreen/attorneygreen_small.jpg"] </script>
Replace the body tag with the following:
<body onLoad="displayRandomImage('changeimage',urls)">
** 'changeimage' is the name you give to your initial image ** See below
Give the original graphic (the one that you want to 'randomise') a html name - here we have named the image "changeimage". This is the image that will change on page reload, so our html will look like this:
<img src="shim.gif" name="changeimage" width="222" height="224"/>
Note; We have used a transparent gif as the loading image... so that there is is a seamless transition when the images change.
Do not copy the script from this page, download a text version of the script here: Text file You can copy and paste the contents of this file into the head of your own document.