This script allows you to present random images each time the page is loaded or reloaded.
The operations plan is as follows:
Fisrtly you need to show the function the array of images you want to be randomly refreshed at the page load(reload).
The core of the script is the javascript function Math.random() which generates random figure (most likely a decimal fraction with 16 decimal values) in the range between 0 and 1.
if you multiply the decimal fraction by the number that is lower by 1 than the number of arguments in your array (in this case images) you get an algebraic integer that corresponds to the sequence number of each argument (in this case images) in your array.
After that you associate that randomly generated number with a certain image in your array that has that sequence number - and get it uploaded in the place where it belongs.
Sounds complicated? Never fear - I'll explain it again. The default sequence number of the first argument in the array is 0, so if your array contains 5 images the sequence number of the last one will be just 4. But the amount of array arguments (array length) is 5! See the trick here? You can't just multiply the rounded random integer by the amount of array arguments because it this case you might get 5 for which there's NO argument (image in our case). This is why you should always subtract 1 from total number of arguments in the array.
And here comes the code.
Place this piece of code into your <head> section
<script language="Javascript">
function RandomizeImage()
{
var imagesarray = new Array("1.gif", "2.gif", "3.gif", "4.gif")
*/
here you indicate path to all images you want ot partake in this misdemeanor
*/
var randomnumber = Math.round(Math.random()*(imagesarray.length - 1))
document.images.someimage.src = imagesarray[randomnumber]
}
</script> |
You will need to invoke the function at each page load. For this just add onLoad event handler to the <body> tag
<body onLoad="RandomizeImage()">
and this should belong where you want image to appear.
<img src="1.gif" name="someimage">
Note that name here should be the same as what's marked as bold red in the <script> section.
Happy randomizing!!!
