topics:
  Flash MX 2004
  Flash MX
  Flash 5
  ActionScript
  Graphics | Motion
    PHP and XML
  PHP Basics
  PHP Advanced
  PHP/XML & Flash
  Web Tricks
  Web Technologies
  Swift 3D
   
 

 

kirupaForum
Active topics:
 
 
amazon.com

 

 

 

 

 

 
Loading a Random Image
       by kirupa : 12 June 2004

Are you interested in introducing some randomness to your web pages? Of course you are! One such way is by loading a random image. If you have a site containing a splash image, you may want to consider displaying a different image each time a visitor visits your site. You can accomplish that by loading a random image using PHP.

The following is an image that is displayed randomly. Reload this page to see another random image (unless the same random number occurs again):
 

  "); ?>

 
[ a random image is displayed each time you reload this page ]

Let's get right to the code. The code that is responsible for displaying the above random effect is:

<?php
$file_array
= array
(
'http://www.kirupa.com/me/footer/footer_home.gif',
'http://www.kirupa.com/me/footer/footer_mit.gif',
'http://www.kirupa.com/me/footer/footer_music.gif',
'http://www.kirupa.com/me/footer/footer_music2.gif',
'http://www.kirupa.com/me/footer/footer_tv.gif',
'http://www.kirupa.com/me/footer/footer_orange.gif',
'http://www.kirupa.com/me/footer/footer_game.gif');
$total = count($file_array);
$random = (mt_rand()%$total);
$file = "$file_array[$random]";
print(
"<img src=$file></a>");
?>

If you want to use this effect on your site, simply copy and paste the above PHP code into a PHP page. Change the addresses in the array $file_array with the path to your images. You can add more image paths, remove image paths, etc. and the code will take your changes into account. Neat!

Code Explanation
In the following sections I will explain the code and why it works the way it does.

$file_array = array
(
'http://www.kirupa.com/me/footer/footer_home.gif',
'http://www.kirupa.com/me/footer/footer_mit.gif',
'http://www.kirupa.com/me/footer/footer_music.gif',
'http://www.kirupa.com/me/footer/footer_music2.gif',
'http://www.kirupa.com/me/footer/footer_tv.gif',
'http://www.kirupa.com/me/footer/footer_orange.gif',
'http://www.kirupa.com/me/footer/footer_game.gif');

Don't let the length of the above section of code scare you. It is simply an array of items, with each item referencing the path of an image file. The array's name is  $file_array. A simplified way of looking at the above section is:

$file_array = array('address1', 'address2', address3');

The abbreviated form above is the basic structure of the array. For aesthetic purposes, I arranged the array items vertically as opposed to the more traditional, horizontal format. I can do that because PHP does not differentiate between spacing. You can arrange items in whichever way that works for you.

$total = count($file_array);

The variable $total receives the results of the count() function. The count() function is an effective way of finding out how many items are stored in your array - $file_array.

$random = (mt_rand()%$total);

In this line, I specify a random number depending on the number of items contained in the array. $random receives the values of the mt_rand()%$total expression.

If you recall, the value for $total is equivalent to the number of items in your array. Multiplying the total number of items by the mt_rand() function yields a random number.

The value of $random will go between a number that is 0 and $total-1. In our code, using 7 items, you will receive a random number between 0 and 6. That suits our situation well as you will see in the next section.

$file = "$file_array[$random]";

In this line, we retrieve the value of the item from an array and equate it to the $file variable. Remember, in an array, the first item starts with an index number of 0 and increases incrementally until you reach your last item which will have an index number of $total-1. In other words, if your array has 7 items, your array will number the first item at 0 and the final item at 6.

Since our random number will also go from zero to $total-1, this line of code works out well for us!

print("<img src=$file></a>");

In this line we are outputting our results to the browser. You are printing the HTML code that will be responsible for displaying the image, and the path of the image is represented by $file.

Quick Recap
First, the array containing the location of your movie clip is initialized. A variable then retrieves the total number of items contained in that array. Once that number has been determined, that number is used to determine a random number. The random number goes from 0 and one less than the total number of items in the array. If your array had 7 items, your random number goes from 0 to 6.

Once the random number has been determined, we retrieve the appropriate value from the array using that random number. That value you retrieve from the array is the address of your image file, for that is what our array contains. Once you have your image file location, you can output the HTML code for displaying an image file including the location you determined.


I hope the information helped. If you have any questions or comments, please don't hesitate to post them on the Forums. Just post your question and I, or our friendly forum helpers, will help answer it.

Also, if you are interested in helping out the kirupa.com site, click here to find out how.

Cheers!
Kirupa Chinnathambi
kirupa.MIT

 

 

 
MediaTemple's killer servers host kirupa.com.
 
Buy high-quality pixel fonts for Flash.
 
 
 
 
 
 
Flash menus and buttons.
 
  XML Flash Menus