Written by Kasumi

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

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

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

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

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

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

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

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

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

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

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

解説を終わります!

目次

関連記事

jQuery

jqueryを使って、パラメーターを追加・付与し、条件分岐する方法

更新日:2022.09.09
4127
jQuery

【jQuery】背景に波紋アニメーションを実装する方法

2023.08.28
1034
jQuery

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

更新日:2022.09.09
5075
jQuery

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

更新日:2022.11.25
5339