Here’s where a little bit of

Swappin’ Styles
When a document is initially loaded, the persistent and preferred style sheets are applied to the document. The alternate style sheets can then be selected by the user. The W3C tells us that the browser should give us a choice of the style sheet we want to use, and suggests that perhaps a drop–down menu or tool bar will be provided.

There is a w3c specified DOM Level 2 attribute, “disabled,” that is set to false when a style sheet is applied to the document. This attribute is correctly implemented in Mozilla, but unfortunately not in MSIE.

MSIE does have a proprietary HTML attribute, also called “disabled,” that applies to link elements. This attribute is initially set to false for all link elements.

To set the MSIE disabled attribute to match the DOM Level 2 disabled attribute, we can call the setActiveStyleSheet() function with the name of the preferred style sheet.
In the onload function, we first set a title variable. This either holds the value of the previous style sheet that is stored in the cookie, or if there isn’t one, the title of our preferred style sheet. To keep things logical, let’s call the cookie “style.”

Next we call up the setActiveStyleSheet() function passing the title variable as the title. Our onload function looks something like this:


To find out which style sheet is the preferred style sheet, we need another function. Because this function is so similar to the getActiveStyleSheet() function I’m not going to explain how it works, but here is what it may look like:


So far, so good. We have several style sheets and the visitor can choose their favorite from a menu. But then we encounter a problem. A major one. Mozilla provides a menu to select the style sheet we want to use under the view menu item. But Microsoft Internet Explorer (MSIE) provides no such menu. So we have several style sheets, and no way to access them in MSIE.

Here’s where a little bit of JavaScript can be used along with the DOM to provide a way for MSIE and Mozilla users to select the style sheet they want to use. Their preference can also be stored in a cookie. And because we are using the link tags as the W3C tells us to, the JavaScript doesn’t interfere with the menu in Mozilla, and it degrades very gracefully.