...

View Full Version : Detecting the Stylesheet in Use



Sayonara
01-29-2005, 04: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, 07: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:

document.styleSheets[index].disabled;

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

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

Sayonara
01-29-2005, 08:28 PM
Ah, I found this, which looks useful:
http://www.quirksmode.org/dom/w3c_css.html

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

function displayStyles()
{
var cssFiles = "";
for(i=0;i<document.styleSheets.length;i++)
{
// 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";
}
alert(cssFiles);
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum