Sunday, September 14, 2008

Display random images each time a page loads or is refreshed in coldfusion

An easy way to keep the look of your site fresh is to display a different image each time the page is refreshed or loaded. Accomplishing this is a very simple task.
Say you want your header image to be the random image. First create a directory for the header images in your image directory.
ex - images/header/
Let's say we're going to swap between 4 images that are stored in our images/header/ folder. They are named 1.jpg , 2.jpg , 3.jpg , and 4.jpg
On your header cfm page you'll need two things.
First a <cfparam> statement like the following: <cfparam name="imageswap" default="#randrange(1, 4)#">
... name it whatever you want. The randrange() is the key here. Change the 4 to whatever number of images you want to swap between.
Next, an if statement:


<cfif imageswap is "1">
<img src="images/header/1.jpg" width="539" height="119" border="0">
<cfelseif imageswap is "2">
<img src="images/header/2.jpg" width="539" height="119" border="0">
<cfelseif imageswap is "3">
<img src="images/header/3.jpg" width="539" height="119" border="0">
<cfelseif imageswap is "4">
<img src="images/header/4.jpg" width="539" height="119" border="0">
</cfif>
</b>
Or you can do this:
<b><cfoutput>
<img src="images/header/#imageswap#.jpg" width="539" height="119" border="0">
</cfoutput>


That's it, they'll load randomly. You can do this with an unlimited number of images. Enjoy!

No comments: