FAQ(よくある質問)とか、Q&Aページでよくある、「Q.○○ですか?」のような質問事項をクリックすると、
その下にアンサーが表示される、もう一回質問事項をクリックすると引っ込む、というシンプルな機能が作りたかった。
こういう1つの項目に対して1つの説明があるものは<dl>,<dt>,<dd>タグを使って実装すると良いらしい。
■事前準備
・jquery.jsを読み込む
・<dd>をdisplay:none;に設定しておく
■コード
HTML Jquery
回答が開いてる間は色を変えるとかやる場合は、$(this).toggleClass("open_question");
とか書くと、クリックした<dt>にclass="open_question"が付いて装飾が簡単にできます。
もちろんこのclassもtoggleなので、次にクリックしたとき(回答を閉じるとき)には消えてくれます。
シンプルでとても便利。
その下にアンサーが表示される、もう一回質問事項をクリックすると引っ込む、というシンプルな機能が作りたかった。
こういう1つの項目に対して1つの説明があるものは<dl>,<dt>,<dd>タグを使って実装すると良いらしい。
■事前準備
・jquery.jsを読み込む
・<dd>をdisplay:none;に設定しておく
■コード
HTML Jquery
回答が開いてる間は色を変えるとかやる場合は、$(this).toggleClass("open_question");
とか書くと、クリックした<dt>にclass="open_question"が付いて装飾が簡単にできます。
もちろんこのclassもtoggleなので、次にクリックしたとき(回答を閉じるとき)には消えてくれます。
シンプルでとても便利。