エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
WAI-ARIAを使用したJSアコーディオンの実装 - Qiita
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
WAI-ARIAを使用したJSアコーディオンの実装 - Qiita
JSでアコーディオンを作成するときに、対象の要素に対して.onクラスをつけて状態を判別したりしています... JSでアコーディオンを作成するときに、対象の要素に対して.onクラスをつけて状態を判別したりしていますが、なんだかなーと思ったので変更してみました。 WAI-ARIAを使用すれば要素の状態を明示できるので、余計なクラスがつかずにいい感じかなーと。 WAI-ARIAについて @h_plum さんの記事がとても参考になるので、こちらでご確認いただくと良いと思います。 アクセシビリティを意識したWAI-ARIA実装について デモ まずは出来上がったものをどうぞ。 See the Pen wai-aria accordion by かぶきち (@cubkich) on CodePen. ではそれぞれ解説していきます、 HTML <div class="wrapper" role="tablist"> <h3 id="acdTab01" data-acd="tab" role="tab" aria-