ブレイクポイントに切り替わったタイミングで処理を実行(window.matchMedia)

[ ID : 6132 ]
ブレイクポイントに切り替わったタイミングで処理を実行(window.matchMedia)
実装目安
3分

概要

JavaScriptのwindow.matchMediaメソッドを使用して、メディアクエリに設定したブレイクポイントに切り替わったタイミングで処理を実行する方法を紹介。

用途・要件

  • ロード時および画面をリサイズしてブレイクポイントに切り替わったタイミングで処理を1回実行。
  • JavaScriptのwindow.matchMedia()を使用。
  • DEMOでは、設定したブレイクポイント(750px)に切り替わるタイミングでテキスト「PC」「SP」を切り替えています

検証ブラウザ

  • Google Chrome(最新)
  • Microsoft Edge(最新)
  • Firefox(最新)
  • Safari(最新)

実装

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

全ての記事を見る

KONOCODEのメリット 無料会員登録