Rotating Images
A three-column Web page was designed specifically for MHC home
pages and to provide a space for rotating images. Reload this page
and the above image will randomly rotate. In order for the images
to rotate, HTML code must be placed in two areas of the source code
and images, which must be an exact width and height, are placed
in a specific file folder. See details below on
how to incorporate rotating images on your Web
page.
Example of a three-column page layout:
How to Incorporate Rotating Images
1. Create Images
Create several images and place them into a folder titled "grafx"
in your Webspace. The images must be exactly 287 pixels wide by
105 pixels high. The file names for the image must be numbered sequentially,
ie, 1.jpg, 2.jpg, 3.jpg, 4.jpg, etc. The images will load randomly,
so it does not matter what number is assigned to any image.
2. Place Rotating Image Script into HTML
There are two areas where code must be placed for
the rotating images to work:
- Head
Copy the following code and then paste it (in HTML) above the
</head> section, ie, after
<title>Rotating Images </title>:
<!--.function
rotateImage "path,num,ht,wid";
if !"$ht";
set ht=105;
endif;
if !"$wid";
set wid=287;
endif;
random $num r;
return "<img src=\"$path/$r.jpg\" width=$wid
height=$ht alt=\"\">";
endfunc;
--> |
- Column two
Place your cursor in the top cell of column two, go to the HTML
view, then paste the following, with the appropriate modifications
(shown below):
| <!--.&rotateImage
"/offices/finaid/grafx/" 11--> |
- Modify the path, in this case: offices/finaid/grafx/, to reflect
the exact location of your images.
- Modify the number at the end of the code, in this case: 11,
to represent the exact number of images in your "grafx"
folder.
After you save your Web page, view it live from a Web browser and
reload the page to verify the images rotate. |
