Change a DIV's Background via CSS based on time

[Favourtism]

Hey,

I've got this piece of CSS;

#header {
background: url(images/header.png);
height: 150px;
width: 900px;
}

How do I set it so that between 9PM and 6AM the background for it is images/header1.png (showing moon etc) and otherwise it displays header.png (sunshine etc)

+rep to all help

[Mentor]

Hey,

I've got this piece of CSS;

#header {
background: url(images/header.png);
height: 150px;
width: 900px;
}

How do I set it so that between 9PM and 6AM the background for it is images/header1.png (showing moon etc) and otherwise it displays header.png (sunshine etc)

+rep to all help

Youd probably need to use php, ether to generate that bit of css, or as part of the image itself*

*basically you create a php file that contains the code to include the image you want depending on the time of day. Use a htaccess to make the php interpreter check say, pngs for php, then change the extension of your image file php to png itself "/

Though easiest method would probably be just to cut the image out of your css and apply it as an inline style using some php inside your page. "/

[Favourtism]

Right, how do I do that LOL. The only PHP I can do is advertisment/banner random generators etc

[Mentor]

This is my 26th hour awake coming from 2 hours sleep last night so appologise if the code makes no sence

change your (im guessing div) tag id'd as header to add the style=' stuff ' and php bit below. + remove the background image from the css up top

<div id='header' style='background-image: url(<?php

$time = date('G'); //return current hour (server time)

if($time < 7 || $time > 21) echo 'images/header.png'; // 9;00pm -> 6:00am
else echo 'images/header1.png'; //7am ->8pm

?>);'>

No garentees thats correct / will work, twas off me head and me head has kinda stopped working

[Mentor]

This is my 26th hour awake coming from 2 hours sleep last night so appologise if the code makes no sence

change your (im guessing div) tag id'd as header to add the style=' stuff ' and php bit below. + remove the background image from the css up top

<div id='header' style='background-image: url(<?php

$time = date('G'); //return current hour (server time)

if($time < 7 || $time > 21) echo 'images/header.png'; // 9;00pm -> 6:00am
else echo 'images/header1.png'; //7am ->8pm

?>);'>

No garentees thats correct / will work, twas off me head and me head has kinda stopped working

[Favourtism]

Hey,

Just remembered that vBulletin Templates do not parse php LOL. Lemme add it as a product and try. THANKYOU

[Favourtism]

Screw that, I'll make it a .php file and then use that as the divs background.

How do I edit that PHP so that instead of generating the url or header.png, it actually shows it?

[Meti]

While browsing around searching for a css style switcher, I came along this thing.
Let me Google and find it again

EDIT: Check this..
http://www.katgal.com/2007/03/time-s...er-change.html

[Favourtism]

While browsing around searching for a css style switcher, I came along this thing.
Let me Google and find it again

EDIT: Check this..
http://www.katgal.com/2007/03/time-s...er-change.html

Dont really wanna change the whole css though

[Meti]

You only change the background image...?
Copy the default.css, and rename it to like "night.css". Then only change the background. And edit the codes given by the KatGal site.