Style Sheet Switching using Javascript

Want to let your visitors change the style that they see when they come to your web page? Changing your style sheet through Java isn’t as complex as it may seem at first. “To start things off, let’s take a look at some code for loading CSS files:

<link rel="stylesheet" type="text/css" href="persistent.css" />

This first method creates a persistent style sheet. This means that the style sheet will definitely be loaded and enabled for use on this web page. Most style sheets used on the web are loaded in this manner by placing this code in the head area of an HTML document. The properties of the style change when we add a title attribute, like so:

<link rel="stylesheet" type="text/css" href="preferred.css" title="swanky" />

This tag loads a css file, just like before, except this time, the file is given a title and thus it becomes known as a preferred style sheet. By default, this style sheet will be loaded and enabled for use on the web page. The difference with preferred style sheets is that they can be disabled (turned off) when other alternate style sheets are turned on. Multiple style sheets can be given the same title and they will be turned on and off as a group. So, the next thing we need to know is how to define an alternate style sheet. The code looks like this:

<link rel="alternate stylesheet" type="text/css" href="alternate.css" title="groovy" />  "

For more information, please read the full article from Spoono.