Today I was working on a project that had a strange bug affecting only Firefox on Windows. For this I needed a way to target just Windows. I managed to use the following snippet of JavaScript to detect the “user agent” or operating system to dynamically add a class to the <body> tag.

if (navigator.appVersion.indexOf("Mac")!=-1) {
	$('body').addClass('mac');
} else {
	$('body').addClass('pc');
}

From there I was able to target all windows users with CSS specific to body.pc. If you use this snippet be sure to load at after the <body> tag is created, or if it’s used in the <head> section of the document or an external file use a document/window load function.

I hope this helps someone else out there!

About the Author

Kevin Leary is a freelance developer in Boston, MA with a strong portfolio of work, and over 13 years of experience as a programming consultant and digital strategy provider. Interested in working together? Hire me for your next project.