[Nebagakid]

Can someone help me with a javascript to change the CSS according to the time of the day. So, when it is the night, the CSS would be one file. During dawn, another

Can anyone help me there

[James L]

[php]
dateObject = new Date();

theTime = dateObject.getHours();


if (theTime < 11)
{
document.write("<link rel='stylesheet' type='text/css' href='morning.css'>");
}
else if ((theTime > 11) && (theTime < 17))
{
document.write("<link rel='stylesheet' type='text/css' href='afternoon.css'>");
}
else
{
document.write("<link rel='stylesheet' type='text/css' href='evening.css'>");
}
[/php]


The above code would go into the head of your page, and it is based on you having three external stysheets called morning, afternoon, and evening. The script is run each time the page is loaded, and will dynamically load the appropriate sheet.

Note, 13% of web users disable scripting apparently, which means they won't get any stylesheet at all with the above script. You could add this to the bottom of it:

[php]
<noscript>
<link rel="stylesheet" type="text/css" href="default.css">
</noscript>
[/php]

I haven't tested the above code at all, but that is the general idea.

Hope this helps!

[James L]

double post

[Nebagakid]

thanks hya

[James L]

Hey, you are fast! I wnet back and edited the code (I didn't have it encased in the bulliten board php tags so the document write statements were empty).

Hope you got the final version!

Cheers!

[Nebagakid]

This did not work for me:

[php]<script language="javascript" type="text/javascript">
dateObject = new Date();
theTime = dateObject.getHours();

if (theTime < 08)
{

document.write("<link rel='stylesheet' type='text/css' href='styles-afternoon.css'>");

}

else if ((theTime > 08) && (theTime < 17))

{

document.write("<link rel='stylesheet' type='text/css' href='styles-day.css'>");

}
else if ((theTime > 17) && (theTime < 21))

{_document.write("<link rel='stylesheet' type='text/css' href='styles-afternoon.css'>");}

else

{document.write("<link rel='stylesheet' type='text/css' href='styles-night.css'>");

}
</script>
[/php]

I then stripped it down to this, and it worked:
[php]<script language="javascript" type="text/javascript">

document.write("<link rel='stylesheet' type='text/css' href='styles-night.css'>");

</script>
[/php]

[James L]

Hey, I can see a few things with the code you reposted...

1) You don't need the "language" attribute in your script definition, only the type one. Not something that is causing the errors, just an old tag.

2) You don't need to say (theTime < 08), only (theTime < 8). Notice no zero before the 8.

3) In one of your document.write statements you have a dash before the word document... remove this. i.e., instead of _document.write, it should just be document.write.


You can test your scripts for correct syntax by placing them in a page, loading that page in netscape, and then typing this in the address bar:

javascript:

Note the colon on the end. This brings up the javascript console which will tell you where the errors are, what line, etc.

The code segment that you posted (stripped down) would work, but will always show the same stylesheet. I am guessing this isn't the effect that you were after!

I am off to work right now, but will be back home later tonight. I can actually play with the code (I just posted that off the top of my head before) and repost it later if you want.

Cheers!

[Millennium]

What Web host are you using?

This is the sort of thing which is better done server-side, so that you can catch non-JavaScript users. If you are lucky enough to be using Apache, mod_rewrite is Your Friend.

[Raman]

Originally posted by Millennium:
What Web host are you using?

This is the sort of thing which is better done server-side, so that you can catch non-JavaScript users. If you are lucky enough to be using Apache, mod_rewrite is Your Friend.

People that can't run javascript probably won't be able to view the css pages properly, anyway.

[James L]

Why?

if you are referring to old browsers I see what you mean, but 10-13% of people purposely disable scripting within their browsers... even current version browsers that have complete CSS support (well, as complete as we get now-a-days)! So, you would get a lot of people who have good CSS support, but purposely disabled their scripting.