This site provides the following access keys:

Brandan Lennox's

Detecting CSS Presence with JavaScript

I’ve been doing a lot of work on my portfolio site these last few days (it ain’t done yet). The front page now has a respectable amount of Scriptaculous animations showing off my past work. Of course I only added the effects once the natural page structure was solid, but even so, with all the DOM manipulation, visitors with JavaScript turned on and CSS turned off would get a lot of useless elements scattered throughout the page. Yes, that configuration is rare, but it’s easy enough to work around if you can detect the presence of CSS within your JavaScript.

I quickly found David Hellsing’s jQuery implementation of a CSS detector. I favor Prototype, so I rewrote it:

var CssDetector = {
  isCssEnabled: function (){
    var d = new Element("div").setStyle({ width: "1px" }).hide();
    $(document.body).insert(d);
    return [d.getWidth() == 1, d.remove()][0];
  }
};

Example usage:

Event.observe(window, "load", function (){
  console.log(CssDetector.isCssEnabled());
});

Hope it helps someone out there. Brownie points to anyone who can get it down below three lines.