Girl in the Ring - Web Star Dot Star

CSS Browser detection using jQuery instead of hacks

- July 09, 2009

Browser sniffing is messy. There are a million ways to do it but none of them are particularly clean and most involve conditional statements such as "" for IE and various other CSS selector hacks for other browsers. I've done a fair amount of browser sniffing with jQuery recently and it's really easy, useful for when you need to detect the browser and version number in your javascript. It occurred to me that it would be easy to detect the browser and then put something in the DOM that your CSS could use for conditional formatting. So I wrote a quick script in JavaScript/jQuery. How it works: All you have to do is include the JavaScript file in the head of the page and it'll attach 2 classes to your body tag to say what browser and what version is being used so you've got 2 levels of granularity. Possible values are... .browserIE .browserIE6 .browserIE7 .browserIE8 .browserChrome .browserChrome1 .browse...