CSSのメディアクエリブレークポイントと連動して、スマホやタブレット別の処理を行いたい。誰でも簡単に扱えるjQueryの判定関数を作成してみました。 ここ数年、WEBサイトをレスポンシブ化しない例が無いくらいにレスポンシブが定着しています。 さらに近年のGoogleによるモバイルファースト施策に対し、レスポンシブは優位な技術ですので今後もレスポンシブ時代は続きます。 レスポンシブの技術自体はCSSのメディアクエリによる解像度の判定だけですので簡単に導入可能ですが、依然としてCSSやSCSSの欠点でもある静的プロパティをjavascriptで補う機会は多いです。 そこで良くあるブレークポイントである、 タブレット スマートフォン 上記のデバイスにおいてCSSのメディアクエリとJSを連動させる仕組みを作りました。 完成したコード 以下のコードをサイトに組み込んで下さい。 CSS .visibl