loading
I currently have availability
logo

Hi, I'mKevin Shoffner

Easy Random CSS Background Tip

Some times you want/need a background image to make the user experience fresh, but not too crazy.  What about a simple background change? I wish it was really simple, and I could just upload some images and not have to do anything else… No plugins, not much programming.. Guess what?  After I wrote my own script to do this very thing, I happened to come across a smarter script, so let’s get started.

Let’s make this super simple ————–

The Randomization:

  1. Download rotator.txt from A List Apart, rename it rotator.php.
  2. Unload your images for the randomization in the same directory as rotator.php.
  3. Upload all the files via FTP.

CSS:

#rotator { background: url(images/rotator.php) no-repeat center top; } 

 

DEMO:

For an example, I am using this idea on the homepage of this site.

6 comments
  • dbahsee
    dbahsee | April 18, 2014

    If im using dreamweaver would i place this in a specific part of my css information or anwyehere i want? sorry im still new to this

    • k.shoffner
      k.shoffner | April 18, 2014

      Yes, you will need to add this code to your CSS class which needs to have the rotating images located. If you run into issues, send an example URL and code you have used

  • dbahsee
    dbahsee | April 19, 2014

    sorry ive been trying to tinker with it to get it done myself. BUt I wasnt sure if i had to remove the first listing of code in reference to the background under body. , I basically inserted it in a seperate line after that one and it automatically threw it tot the bottom of the page. my site is Deebeepics.net

    • k.shoffner
      k.shoffner | April 19, 2014

      Can you provide me the before & after code? I see near the bottom there is a random “}” near the subscribe area, but I don’t know what you added exactly so I don’t want to provide advice without knowing exactly what you added.

  • scott_ease
    scott_ease | July 1, 2015

    Do you know if the rotator file work with Zen Cart? I tried but didn’t work out.
    Thank you.

    • k.shoffner
      k.shoffner | July 1, 2015

      I have not seen this done with ZenCart, but if you would like me to do some troubleshooting to see if I can get it to work just let me know and I can give you an estimate

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: