Modernizrを使用して、ユーザーがデスクトップ、タブレット、またはモバイルデバイスでサイトを表示しているかどうかを検出したいと思います。
私が最初に考えたのは、明らかに、モバイルデバイスやより大きなデスクトップに十分な画面サイズを確認することです。画面サイズが小さなデスクトップ画面（1024 x 768）と同じになる可能性があるタブレットデバイスの場合、タッチイベントもテストします。
今回は、jQuery mobileが言うように、Aグレードのモバイル/タブレットデバイスに焦点を当てたいと思います。デスクトップ、タブレット、またはモバイルを検出し、テストの結果に応じてCSSクラスを追加することで、それぞれに合わせたUIを提供するだけで、特定のモバイルデバイス機能を利用するつもりはありません。
これで私が望むことを達成するのに十分だと思いますか、それとも他の機能をテストする必要があると思いますか？よろしくお願いします。
この質問は少し古いですが、グーグルで検索したときに、より良い答えを見つけることができませんでした。
現在、ほとんどのデスクトップはタッチ対応になっているため、それを検出することは重要ではありません。
それらを検出する最良の方法は、画面サイズによるものです。
Modernizrを使用すると、if (Modernizr.mq('only all and (max-width: 480px)')) { ...}
Modernizrはタッチイベントをチェックできます
デバイスがタブレットか電話かデスクトップかをテストするために、私はおそらくユーザーエージェントの使用にもっと傾倒するでしょう。DetectMobileBrowsers.comのスクリプトを見てください
Modernizrは、ブラウザが特定の機能をサポートしているかどうかをテストするだけです。私の知る限り、browser_type == mobileそれらの線に沿ってテストしたり詰め込んだりするようには見えません...
最近の多くの最新のデスクトップPCにはタッチスクリーンが搭載されているため、タッチサポートを検出しても、それがモバイルデバイスまたはタブレットであるとは限りません。
Modernizrには次の拡張機能を使用できます： https ：//www.npmjs.org/package/mobile-detect
または（Modernizrなしで）Restive.JSを使用して、「。phone」または「.tablet」クラスを体に追加できます：http: //docs.restivejs.com
（ページの下で「formfactor」を探してください。）
「正しい」答えは時間とともに変化したと私は信じているので、これは古い質問に対するフォローアップの答えです。
これを回避するために私が見つけた最善の方法は、画面のDPIをピクセル単位の画面サイズと組み合わせて乗算することにより、物理的な画面サイズを計算することです。