View Full Version : Detecting the Stylesheet in Use

01-29-2005, 05:05 PM
Each page on this site I'm working on uses Stewart Rosenberger's Dynamic Text Replacement Script (http://www.alistapart.com/articles/dynatext/) to replace the content of h1 and h2 tags with dynamically-generated images (without changing the page structure, for accessibility reasons.)

Normally, a visitor would follow the link for "Text Only" to turn off the image replacement script, and swap the preferred stylesheet with a text-only stylesheet.

However, if a visitor switches to the alternate text stylesheet using their client, the image generator script is not disabled.

What I want to know is, can JavaScript be used to detect the stylesheet that the client is currently using?

If so I will be able to turn off the DTR script, and I won't need to remove the option of having the alternate style sheet.

Puffin the Erb
01-29-2005, 08:49 PM
The following syntax will return false if a particular StyleSheet is applied, true if not, where 'index' is the position of the StyleSheet, you are checking for, in the styleSheets array:


01-29-2005, 09:15 PM
That looks like just the thing, thanks :thumbsup:

Can I print the stylesheets array to the screen for reference?

01-29-2005, 09:28 PM
Ah, I found this, which looks useful:

Puffin the Erb
01-29-2005, 09:51 PM
You could list style details thus :

function displayStyles()
var cssFiles = "";
// get rid of initial part of URI as it may exceed alert box dimensions
var nextStyle = document.styleSheets[i].href.split("/") ;

cssFiles += nextStyle[nextStyle.length-1] + " [ " + document.styleSheets[i].title + " ]" + "\n";