New to CSS... Want to randomize background image

Discussion in 'CSS' started by c0creat0r, Jan 17, 2011.

0
  1. #1
    Hey guys, I'm new to CSS scripting and all. For our fantasy football site, I've created a CSS for the site and have no problem putting a single background on the site.

    I am trying to figure out how to make it so I can randomly display one of 4-5 different backgrounds on the site.

    My site address is: http://www10.myfantasyleague.com/2010/home/36631

    And my background images are:

    http://home.comcast.net/~c0creat0r/MTL/Background-Images/background1.jpg
    http://home.comcast.net/~c0creat0r/MTL/Background-Images/background2.jpg
    http://home.comcast.net/~c0creat0r/MTL/Background-Images/background3.jpg
    http://home.comcast.net/~c0creat0r/MTL/Background-Images/background4.jpg

    I've tried a couple PHP randomizers and such, but can't see to get anything to work. Is there an easier way through CSS?

    Thanks guys.
    Rob
     
    c0creat0r, Jan 17, 2011 IP
  2. radiant_luv

    radiant_luv Peon

    Messages:
    1,327
    Likes Received:
    34
    Best Answers:
    1
    Trophy Points:
    0
    #2
    CSS is not scripting. A metod to style markups.

    No, CSS can't randomize background. The easier way would be using JavaScript though if you can't do it with PHP.
     
    radiant_luv, Jan 17, 2011 IP
  3. Entherman

    Entherman Peon

    Messages:
    173
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    You can do it with PHP easily.
    Add this to your PHP Header (for example if you have an index.php file, then add this between <head> here </head>)

    <style>

<?php
# Just pay attention, after the last image, there is no comma ( this one --> , ) and they all have to be in 'single quotes'
$images = array (
'http://site.com/image1.jpg',
'http://site.com/image1.jpg',
'http://site.com/image1.jpg',
'http://site.com/image1.jpg'
);

$count = count($images);
$random = rand(0, $count);
$image = $images[$random];
?>

body {
background-image: url('<?php echo $image; ?>') no-repeat;

}


</style>
    PHP:
    Easy as pie :)
     
    Entherman, Jan 17, 2011 IP