This page is a demo for my Generic Stylesheet Switcher article. You can download the code here: styleswitch.js
A generic approach to stylesheet switching, which allows you to define the strategy with which you want to switch the style (body ID or stylesheet) as well as provide a custom function to decide which style is presented.
There are two things going on here. First, when the page loads up, it checks the referrer and sets the stylesheet. The referrer to stylesheet map is currently:
Secondly, depending on the time of day, the body id is set to morning, afternoon, or evening. The time ranges that govern this are:
You can use the links below to switch to the different times of day without changing your clock to see the effect.
Switch to: morning | afternoon | evening | night
Head back to the Generic Stylesheet Switcher article for more details on how this all works.