Web Publishing at URI

Description

Generates a random image chosen from a list specified by the user. This script allows the user to set up a list of images in a directory, set image attributes including width, height, border, alignment, and an alt tag, and creates a standard-friendly line of code containing the randomly selected image.

Instructions

Code

Copy and paste the following into the head () portion of your web page:

<script type="text/javascript"><!--mce:0--></script>

Configuration

directory = "images/"; // The location of your randomized images.
                           // e.g. "images/myPhotos/"
 
	images = new Array(); // Leave this line as it is
 
	// Fill in the name of the photos in the folder below.
	// To add more images, follow the model below
	// images[x] = "PATH/TO/IMAGE";
 
	images[0] = "image1.jpg";
	images[1] = "image2.jpg";
	images[2] = "image3.jpg";
	images[3] = "image4.jpg";
 
	var width = null; // Enter the width of all images in pixels (e.g. 100)
	var height = null; // Enter the height of all images in pixels (e.g. 50)
 
	var border = null; // Enter the border of all images in pixels (e.g. 1)
	var alignment = null; // Enter "true" to align left; "false" to align right; "null" for no alignment.
 
	var alt = ""; // Enter a meaningful description for your image or leave as is (e.g. "my picture")

In this above portion of the code, you may apply your customized settings.

• directory - (line 1) Define the directory that contains all the images. Can be linked to a relative or absolute (if permitted) location.
• image[x] - (line 9-12) Define the file name of the image located in the directory (line 1)
• width - (line 14) Define the width (numerical value) in pixels of the randomly generated image. May be left as null if you prefer not to define one (optimal for multi-sized images).
• height - (line 15) Define the height(numerical value) in pixels of the randomly generated image. May be left as null if you prefer not to define one (optimal for multi-sized images).
• border - (line 16) Define the size of the border around the image. May be left as null if you prefer not to define one.
• alignment - (line 17) Define the type of alignment for the image (in boolean). Use “true” to align left, “false” to align right, or null to invoke no alignment.
• alt - (line 18) Fill in a meaningful description to describe the photo in text in between the quotes.

Usage

Apply the following to the location where you would like to generate your random image:

<script type="text/javascript"><!--mce:1--></script>

Optional: You may apply this piece of code right after the snippet above to provide a default image in an event the user disables javascript.

<noscript>
	&lt;img src="images/image1.jpg" mce_src="images/image1.jpg" width="750" height="250" border="0" alt="" /&gt;
</noscript>