Test if Mac or PC with JavaScript

User Agent testing sucks, but sometimes you need it for subtle things. In my case I was using it to adjust what I was showing for keyboard shortcut keys (Command or Control). Nothing super major.

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

The statements in there use jQuery to add a body class, but that's not required, you could do whatever.

Comments

  1. User Avatar
    Scott
    Permalink to comment#

    This may be overkill for your intended use, however it really comes in handy if you need to nudge items or if things aren’t quite right on mobile devices.
    http://rafael.adm.br/css_browser_selector/

  2. User Avatar
    Keyamoon
    Permalink to comment#

    Trying to solve the same problem of showing Cmd vs Ctrl, I found this snippet. But what if someone uses Linux on a Mac (with a Mac keyboard)? I have posted this question on stackoverflow as well.

  3. User Avatar
    Aalekh

    would like to add that we can also add navigator object with platform property…….object.platform…it can specifically tell for ex: wether it is macintosh 68k or windows 64bit…..

  4. User Avatar
    Marvel Slots
    Permalink to comment#

    just what a needed to check if it’s a MAC for an .exe file download link (to put a different link for macs)

    • User Avatar
      Will
      Permalink to comment#

      You can set a class in combination with a file type selector

      .mac a[href$=”.dmg”] { STLYE }
      .pc a[href$=”.exe”] { STLYE }

      Is this what you are shooting for?

  5. User Avatar
    Hiren
    Permalink to comment#

    Thanks Mate, It really saved my couple of hours.

  6. User Avatar
    richard
    Permalink to comment#

    can anyone one advise on how to do this with plain javascript not jquery?

    • User Avatar
      Jace Cotton

      Instead of $("body").addClass(<classname>);, you can use document.body.classList += <classname>;, or document.body.setAttribute("class", <classname>); Everything else is the same in javascript as it is with jQuery.

  7. User Avatar
    Jace Cotton

    While user agents can and often are spoofed or ambiguous to begin with, navigator.platform returns the actual platform and isn’t spoofed when the user agent is. Therefore, I like to test navigator.platform for MacPPC or MacIntel (though I don’t think anyone ever uses PPC Macs anymore).

    • User Avatar
      Ian Westerfield
      Permalink to comment#

      I was just going to comment this – navigator.platform is the best way to go.

  8. User Avatar
    Rishabh

    Can we use it to detect Linux. If it can will it detect all linux version or would it only detect aparticular distro like Fedora and Ubuntu.

  9. User Avatar
    Andy
    Permalink to comment#

    plain sample of how to do with JS

Submit a Comment

Posting Code

You may write comments in Markdown. This makes code easy to post, as you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences (```) with double new lines before and after.

Code of Conduct

Absolutely anyone is welcome to submit a comment here. But not all comments will be posted. Think of it like writing a letter to the editor. All submitted comments will be read, but not all published. Published comments will be on-topic, helpful, and further the discussion or debate.

Want to tell us something privately?

Feel free to use our contact form. That's a great place to let us know about typos or anything off-topic.

icon-closeicon-emailicon-linkicon-logo-staricon-menuicon-searchicon-staricon-tag