Written by Kasumi

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

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

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

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

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

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

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

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

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

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

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

解説を終わります!

目次

関連記事

jQuery

【簡単】ajaxを使って別ページにある一部分のhtmlコードを取得し、読み込む方法【jQuery】

更新日:2022.09.09
1719
jQuery

【簡単datapicker】選択した日付によってイベントをjQueryで追加する方法

更新日:2022.09.09
2628
jQuery

bxsliderでスライダー内画像のaタグリンクが効かない時の対処方法【結論slickを使おう】

更新日:2022.11.25
2191
jQuery

CSSの「object-fit」をIEブラウザでも適用させる方法【簡単】

更新日:2022.09.09
426