Random Image Script (with live working model and example)

Random Image Script (with live working model)

A random image helps keep your page looking fresh for returning users.  The following is the code used to create a random image on a website.  Remember to always keep your code in tables so it appears the same in most browsers and most browser versions. The reload button is just there for you to see how it works. So in your webpage you would remove what is between the FORM tags in the code. This is an exmple of JS code that you would NOT put between the HEAD tags like you would with most JS code. This code goes right where you want the images to appear.  It's that simple. You can use as many images as you want.  A link to the working model of this code with pix of cool cars: http://www.fsukxaz.com/RandomImage.html  If you would like to see something similar on a professional credit union website in action, go to http://www.pefcu.com/ and just keep refreshing your browser.

<HTML>
<HEAD>
 <TITLE>Random Image</TITLE>
</HEAD>

<BODY>

<TABLE align="center">
<TR>
   <TD align="center">
      <SCRIPT language="Javascript"><!-- 
   function image() { }; 
   image = new image();
   number = 0; 
   // imageArray
   image[number++] = "<img src='Images/Cien07.jpg' border='0'>"
   image[number++] = "<img src='Images/DurangoHemi.jpg' border='0'>"
   image[number++] = "<img src='Images/FerrariF360.jpg' border='0'>"
   image[number++] = "<img src='Images/Nuvolari.jpg' border='0'>"
   image[number++] = "<img src='Images/GrandPrixG82.jpg' border='0'>" 
   image[number++] = "<img src='Images/SL500Mercedes01.jpg' border='0'>" 
   image[number++] = "<img src='Images/Firebird3.jpg' border='0'>"
   image[number++] = "<img src='Images/InfinityG35.jpg' border='0'>" 
   increment = Math.floor(Math.random() * number);  document.write(image[increment]); 
   //-->
   </SCRIPT>
   <P align="center">
      <FORM>
      <INPUT type="BUTTON" value="Reload" onClick ="location.reload()">
   </FORM>
   </TD>
</TR>
</TABLE>
  
</BODY>

</HTML>

Comments

Be the first to write a comment

You must me logged in to write a comment.