スマホとPCを1ソースで管理するレスポンシブの場合、jQueryのスクリプをPCの場合とスマホの場合でプロパティ値を変えたい場合があります。
jQueryのライブラリなどは、あらかじめレスポンシブ用のコードが用意されてたりしますが、ライブラリを使わない場合は、自分で用意しないといけません。
$(function () { var ua = navigator.userAgent; if (ua.indexOf('iPhone') > 0 || ua.indexOf('Android') > 0 && ua.indexOf('Mobile') > 0) { // スマホ用のスクリプトはここに } else if (ua.indexOf('iPad') > 0 || ua.indexOf('Android') > 0) { // タブレット用のスクリプトはここに } else { // PC用のスクリプトはここに } })
$(window).on('load resize', function(){ var winW = $(window).width(); var devW = 767; if (winW <= devW) { // スマホ用(767px以下)のスクリプトはここに } else { // PC用(768px以上)のスクリプトはここに } });
※jQueryはページが読み込まれた時に発動するので、ウインドウ幅を縮めただけでは、上記のコードでは何も変わりません。リロードをするか、chromeの検証でスマホ版を確認するなどして、表示確認する必要があります。