【WEB】Jqueryでアコーディオンを作ってみた
アコーディオンとはあれですね。
メニュー表示する際に「にょ~」って出てくるあれ!
サンプルは【凡才エンジニアの成果物】に貼っておきますね!
実装は、HTML , CSS , JavaScript を使います。
書かなくてもいいレベルで普通
全体の流れとしては、
非表示 ∧ 重ねているメニューを下にスライドさせながら表示させる!
だけです。
HTML
[ dl ] , [ dt ] , [ dd ] で実装しました。
これじゃなくて [ ul ] とかでもいいと思いますが、デフォで表示させる部分(今回は「メニュー」)の識別が面倒なのでこちらをおススメします。
最低限必要なものは [ position : absolute ] と [ display : none ] です。
つまり隠す処理ですね。
[ dt ] タグがクリックされたら、[ dd ] タグをスライドさせながら表示して∧ [ position ] を直していきます。