web関連

javascriptをレスポンシブ対応させる方法

2022/04/26

プログラミング

言語-javascript

javascriptでビューポートを切り替える「window.matchMedia」の条件分岐の書き方備忘録

「window.matchMedia」を使ってjavascriptのレスポンシブ対応

以下の条件分岐でPCとスマホの表示を分けることができる。

if (window.matchMedia('(max-width: 767px)').matches) {
  // 767px以下の時（SP）
} else {
  // それ以外（PC）
}