Background Changer - Need your help!

Discussion in 'HTML & Website Design' started by SotaGamer, May 22, 2010.

  1. #1
    How do websites such as Machinima have their backgrounds change everytime the page refreshes??

    Is there a mod which I could download or could someone tell me how to do it??

    I am using Joomla 1.5.13.

    If anyone could help I would REALLY appreciate it!

    Thanks,
    SotaGamer
     
    SotaGamer, May 22, 2010 IP
  2. CooganA

    CooganA Peon

    Messages:
    12
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You can achieve this using javascript and jquery

    <html>
    <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript">

    var randomnumber=Math.floor(Math.random()*4) // this number will be between 0 and 4

    var backgroundImageArray = new Array() // five possible images
    backgroundImageArray[0]="image1.jpg";
    backgroundImageArray[1]="image2.jpg";
    backgroundImageArray[2]="image3.jpg";
    backgroundImageArray[3]="image4.jpg"
    backgroundImageArray[4]="image5.jpg";

    $(document).ready(function(){
    $("body").css("background-image","url('"+backgroundImageArray[randomnumber]+"')");
    });

    </script>
    </head>
    <body>
    Hello World
    </body>
    </html>

    Hope this makes sense.
     
    CooganA, May 22, 2010 IP
  3. SotaGamer

    SotaGamer Member

    Messages:
    113
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #3
    So where do I implement this code?

    and should i name my backgrounds image1.jpg...etc?

    Thanks very much!
     
    SotaGamer, May 22, 2010 IP
  4. CooganA

    CooganA Peon

    Messages:
    12
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Try can be whatever name you want to give them, and you can have more or less images if you like. Just make sure when you add more images to the array that you change the number in the random function variable.

    backgroundImageArray[0]="background12.jpg";
    backgroundImageArray[1]="niceCar.jpg";
    backgroundImageArray[2]="callOfDuty.jpg";
    backgroundImageArray[3]="ghs.jpg";
    backgroundImageArray[4]="abc_efg.jpg";

    Also there is a ; missing after ="image4.jpg" otherwise the script will throw an error.
     
    CooganA, May 22, 2010 IP
  5. SotaGamer

    SotaGamer Member

    Messages:
    113
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #5
    I think i understand what to do, but where do I put this code in?
     
    SotaGamer, May 22, 2010 IP