PCの時はタブ切り替え・SPの時はアコーディオン開閉になるギミック処理

概要

用途

• PCの時はタブ切り替えでコンテンツを表示制御したい。
• スマートフォンの時はアコーディオンでコンテンツを表示制御したい。
• 他ページからのアンカーリンク遷移で指定のタブ（アコーディオン）をカレント状態にしたい。

内容

• JSのグローバル変数でブレイクポイントを設定し、ブレイクポイントに合わせて処理を変える。
• PC時のみ、ロード時にアンカーの指定がない場合は一つ目のタブがカレントになる。
  ※SP時はカレントのアコーディオンがない状態になる。

注意事項

• jQuery.breakpoints（ https://konocode.jp/js/plugin/dawn-inc/jquery.breakpoints.min.js ）が必要

検証ブラウザ

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

その他

• jQuery v3.6.0使用。

実装方法

下記サイトから/dist/jquery.breakpoints.min.jsを取得する。
https://github.com/dawn-inc/jquery.breakpoints.js