How to determine if it is day or night in javascript or jquery?

Question

Hi guys,

Im wanting to apply different CSS sheets to my site depending on the time of the browser. e.g if its day time, display day.css or night.css for night.

I can do this with PHP but it is based on the server time, not the browsers local time.

Is there a way to tell the time in javascript? I'm probably going to use jQuery to simply initiate the css once its worked out.

Answer 1

var hr = (new Date()).getHours(); //get hours of the day in 24Hr format (0-23)

Depending on your definition of day/night, perform your magic :)

PS: If your day/night starts not at the exact hour, you can try getMinutes().

Answer 2

(new Date).getHours()

will get the local hour of the time (0-23) of the client. Based on that value, swap the stylesheet for the page. I would set the day stylesheet as the default and swap it out when necessary.

My initial thought is that you would want to perform this operation as soon as possible on the client to avoid any potential browser reflow.