グローバルフレームワーク（ブートストラップ、ファンデーション...）スマートフォン用JS検出

Question

私はこれを数回見つけました。場合によっては、FoundationやBootstrapなどの選択したフレームワークが実際のデバイスをスマートフォンとして検出したかどうかを判断する必要があります。 window.width（）を常に使うことができますが、フレームワークが本当にスマートフォンの内容を表示するかどうかを確認することは安全です（特に、SASSでブレークポイントを変更し、JSを手動で変更したくない場合）。

これを行うには、ヘッダー/フッターで使用される特定のフレームワーククラスのCSSをチェックして、すべてのテンプレートでグローバルに使用されているかどうかを確認するのが最善の方法だとわかっています。

var smartPhone; 
jQuery(window).bind('resizeEnd', function() { 
    if ($(".show-for-small-only").css("display") == "block") { 
     smartPhone = 1; 
    } 
    else { 
     smartPhone = 0; 
    } 
}); 

はそれが役に立てば幸い：

これは、基礎は（foundation.zurb.com）スマートフォンにウィンドウのサイズが変更されるたびに検出したかどうかをチェックjQueryのjsのです。このコードは、スマートフォンのクラスにCSSを追加するすべてのフレームワークで機能するように編集できます。だから私はこれがうまくいかないとは思えませんでした。楽しむ！

さらに、タブレット、ネットブックなどを検出するために使用できます。あなたがこれをしたらあなたのコードを親切にして投稿してください。すべてのフレームワークのためにそのコードを整理するのはちょっと複雑かもしれません。ありがとうございました。

Answer 1

ブートストラップコード：

var smartPhone; 
jQuery(window).bind('resizeEnd', function() { 
    if ($(".visible-xs").css("display") == "block") { 
     smartPhone = 1; 
    } 
    else { 
     smartPhone = 0; 
    } 
});