Oh no! Where's the JavaScript?
Your Web browser does not have JavaScript enabled or does not support JavaScript. Please enable JavaScript on your Web browser to properly view this Web site, or upgrade to a Web browser that does support JavaScript.
Not a member yet? Click here to register.
Forgot Password?

Background Image rotation

Asked Modified Viewed 3,014 times
D
Dear_maria
D
  • Junior Member, joined since
  • Contributed 10 posts on the community forums.
  • Started 6 threads in the forums
  • Started this discussions
asked
Junior Member

Ok the current code i have on my style file for my background image is

Quote

body {
font-family:Verdana,Tahoma,Arial,Sans-Serif;
font-size:10px;
padding:0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-color:#FFFFFF;
background-image:url(images/background1.jpg);
background-repeat:no-repeat;
background-attachment: fixed;
background-position:center;
}


Now I would like to have different backgrounds appear on each page refresh
I am unsure how to get the code to randomly select a background and display it, any ideas?
0 replies

1 post

J
jimboppin
J
Jimbo.
  • Newbie, joined since
  • Contributed 9 posts on the community forums.
  • Started 3 threads in the forums
answered
Newbie

Hey Dear_maria i have this for you http://css-tricks.com/snippets/php/randomize-background-image/
Im on my tablet so its not easy putting the information on but if u still strugle ill write a walk thru when im on the pc wink

Merged on Aug 10 2013 at 18:35:58:
What i have done is removed your background image code and replaced it with this,

[syntaxhighlighter brush=css,first-line=1,highlight=0,collapse=false,html-script=false]background: url(images/<?php echo $selectedBg; ?>wink no-repeat;[/syntaxhighlighter]


new css style code:

[syntaxhighlighter brush=css,first-line=1,highlight=0,collapse=false,html-script=false]body {
font-family:Verdana,Tahoma,Arial,Sans-Serif;
font-size:10px;
padding:0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-color:#FFFFFF;
background: url(images/<?php echo $selectedBg; ?>wink no-repeat;
background-repeat:no-repeat;
background-attachment: fixed;
background-position:center;
}[/syntaxhighlighter]


Now edit /includes/header_includes.php
and add this to the bottom befor the ?>
the bottom should look like this...


[syntaxhighlighter brush=php,first-line=1,highlight=0,collapse=false,html-script=false] $bg = array('bg-01.jpg', 'bg-02.jpg', 'bg-03.jpg' ); // array of filenames

$i = rand(0, count($bg)-1); // generate random number size of the array
$selectedBg = "$bg[$i]"; // set variable equal to which random filename was chosen

?>[/syntaxhighlighter]

the rest is self explanitory, Replace "bg-01.jpg" and so on with the images you would like
and dont forget to check your images dir in the CSS code Default: images/

any trouble let me know, other thing what PHP and CSS version are you useing?
Edited by jimboppin on 10-08-2013 19:35,
0 replies

Category Forum

Themes Support

Labels

None yet

Statistics

  • Views 0 views
  • Posts 1 post
  • Votes 0 votes
  • Topic users 2 members

2 participants

D
D
  • Junior Member, joined since
  • Contributed 10 posts on the community forums.
  • Started 6 threads in the forums
  • Started this discussions
J
J
Jimbo.
  • Newbie, joined since
  • Contributed 9 posts on the community forums.
  • Started 3 threads in the forums

Notifications

Track thread

You are not receiving notifications from this thread.

Related Questions

Not yet