Written by Kasumi

[jQuery]デバイス幅(PC・スマホ)で条件分岐する方法【簡単】

デバイス幅(PC・スマホ)によって表示・動作を切り替えたい!

上記の悩みに回答します。

本記事ではjQueryを使いデバイス幅によって条件分岐する方法を紹介します。

※jQueryを使うので事前にダウンロードかCDNをソース内で読み込んで置いてください。

以下ソースをscript内にコピペしよう

上記ソースをscript内にコピペしましょう!

横幅が1000px以上か、以下で条件分岐させてます。

var devWの値を変えることで分岐させたいpx数を好きに指定できます。スマホのデバイス横幅を調べてpxを変えて見ましょう。else ifを使ってタブレット時の条件分岐を加えるのも有りです。

上記ソース内のコメントアウト部分に、切り替えたい表示・動作のソースを記述すれば完成!

以上で悩みは解決できたかと思います!

解説を終わります!

目次

関連記事

jQuery

【簡単】jQueryを使って、入力中の値をリアルタイムでチェック・取得する方法

更新日:2022.09.09
7935
jQuery

jQueryを使ってdivタグ、pタグ等のテキスト値を取得する方法

更新日:2022.09.09
4214
jQuery

jqueryを使って要素を移動・追加・親要素を作成する方法【簡単テンプレ公開】

更新日:2022.09.09
4750
jQuery

【簡単】横並びブロック要素の高さを揃えるにはmatchHeight.jsを使おう

更新日:2022.09.09
1510