[JS]ユーザビリティに配慮したアコーディオンを実装するチュートリアル

ユーザビリティに配慮しつつ、jQueryのバグにも対応したシンプルなアコーディオンを実装するチュートリアルをSoh Tanakaから紹介します。 Simple Accordion w/ CSS and jQuery デモページ アコーディオンのロジックは下記の通りです。 最初にデフォルトの設定します。 一番目のアコーディオンを開いて、アクティブな状態にします。 クリックをすると。 クリックされたアコーディオンのアイテムは開くのか閉じるのか判定します。 「hidden」（閉じた状態）のアイテムをクリックすると、 全てのアイテムから「active」を取り去り、閉じます。 クリックされたアイテムは「active」になり、すぐにスライドダウンして開きます。 ロジックのイメージは、下記のようになります。 <textarea name="code" class="html" cols="60" row

[rdfrk]

畳み込みのナビゲーションもこの際、ちゃんと理解しておかないとな。 Reading: [JS]ユーザビリティに配慮したアコーディオンを実装するチュートリアル

[syokatu10]

［未整理］

[kivatorial23]

参考サイト　アコーディオン

[masia02]

RT [JS]ユーザビリティに配慮したアコーディオンを実装するチュートリアル

[nors]

http://www.sohtanaka.com/web-design/simple-accordion-w-css-and-jquery/

[yuxu]

[[jQuery]]

[Donca]

✔ [JS]ユーザビリティに配慮したアコーディオンを実装するチュートリアル