もっともっと、もっと先へ。株式会社アットワークMore and more,
further and further.

PCとスマートデバイスを判別する方法はいくつかあります。javascriptを使うのであれば、useragentで条件分岐する方法、画面幅で条件分岐する方法。cssのメディアクエリで条件分岐する方法があります。
ここでは、それぞれの問題点や利点について解説します。

jqueryのuseragentでPCとスマートデバイスで条件分岐する方法

基本的な方法

$(function() {
  var ua = navigator.userAgent;
  
  if (ua.indexOf('iPhone') > 0 || ua.indexOf('iPod') > 0 || 
      (ua.indexOf('Android') > 0 && ua.indexOf('Mobile') > 0)) {
    // スマートフォン
    $('body').addClass('is-sp');
  } else if (ua.indexOf('iPad') > 0 || 
             (ua.indexOf('Android') > 0 && ua.indexOf('Mobile') < 0)) {
    // タブレット
    $('body').addClass('is-tablet');
  } else {
    // PC
    $('body').addClass('is-pc');
  }
});

汎用的な関数にする場合

function getDeviceType() {
  var ua = navigator.userAgent;
  if (/iPhone|iPod|Android.*Mobile/.test(ua)) {
    return 'sp';
  } else if (/iPad|Android/.test(ua)) {
    return 'tablet';
  } else {
    return 'pc';
  }
}

$(function() {
  var device = getDeviceType();
  if (device === 'sp') {
    // スマホ用の処理
  } else {
    // PC用の処理
  }
});

UserAgentによる判定にはラウザの開発者ツールやユーザー側でUAを偽装することができたり、近年iPadのUAがPC(Mac)と同じになっている場合があるなどいくつか問題点があります。

UAの問題点を克服する代替案として、画面幅で判定する方法もあります

デバイスの画面幅を取得する方法

function getDeviceType() {
  var width = $(window).width();
  if (width <= 767) {
    return 'sp';
  } else if (width <= 1024) {
    return 'tablet';
  } else {
    return 'pc';
  }
}

ただ、一般的に共通した考え方としては、PCはタッチデバイスではなく、タブレットやスマホはタッチデバイスであることが言えます。そこで提案するのがCSSによるPCもしくはタブレット・スマホの切り分けです。CSSのメディアクエリで判定します。

/* タッチデバイス(ホバー不可・指などの粗い操作) */
@media (hover: none) and (pointer: coarse) {
  .hover-effect {
    /* タッチデバイス用のスタイル */
  }
}

/* PC・マウス操作デバイス(ホバー可能・精密な操作) */
@media (hover: hover) and (pointer: fine) {
  .hover-effect:hover {
    /* ホバーエフェクトはPCのみに適用 */
    background: #eee;
  }
}

これでJSを記述することなく、PCもしくはタブレット・スマホの切り分けがスマートにできます。