HOME > jQuery > 条件分岐ー画面幅で分岐してレスポンシブ対応

条件分岐ー画面幅で分岐してレスポンシブ対応

jQueryもレスポンシブにしたいときは、画面幅で条件分岐させる。

$(window).on('load resize', function(){
  var w = $(window).width();
  var x = 768;
  if (w > x) {
    // wがxより大きいとき
  } elseif (w >= x) {
    // wがx以上のとき
  } elseif (w < x) {
    // wがxより小さいとき
  } elseif (w <= x) {
    // wがx以下のとき
  }
});

1行目のload resizeは、ロード時とリサイズ時に発動させる呪文。

3行目で分岐させたい画面幅をpx抜きで定義。

参考サイト