Search Our Web Design Blog...

Wednesday, May 11, 2011

WEB 2 - java randomness...

If you could choose between a static home page or a dynamic one, which would you take?

Dynamic every time…but wait, doesn’t that require work to pull off?

Oh, and you could use this for more than just header images; I just figure that most folks will want to rotate their headers, since they tend to be the most dominant visual elements.

Are you ready to go random? Let’s do it!

1. Prepare Your Header Files

We're going to use 5 different images in our random header generator

For the purposes of this example, we’re going to use 5 different images to pull off our random header effect. It’s important that these images be the same size — this will keep your image declarations consistent and W3C-valid. So, grab the five header images of your choice, and name them according to the following convention:

  • header_1.jpg
  • header_2.jpg
  • header_3.jpg
  • header_4.jpg
  • header_5.jpg

One thing worth noting here is the fact that all of your images should have the same file extensions. If you’re using .gif files, then make sure that each header image has the .gif extension. Photographs will look infinitely better if saved as .jpg, though, so that’s why I’ve chosen that extension here.

Upload the images to your desired directory on your server. If you’re using WordPress, I’d suggest uploading the images to the images folder within your active theme directory. Once your images are on the server, it’s time to install the random header code.

2. Code It Up!



This free script provided by

JavaScript
Kit

No comments:

Post a Comment