【html】普段は折りたたんでおいて、クリックで開くようにする

■ 参考 : クリックすると展開表示する"折りたたみメニュー"を簡単に作る方法

<div onclick="obj=document.getElementById('open').style; obj.display=(obj.display=='none')?'block':'none';">
<a style="cursor: pointer;">▼ クリックで展開</div>

<div id="open" style="display: none; clear: both;">
ここが折りたたまれてるところ
</div>

openと書いてあるIDはそれぞれ一致したものを使う
もしこの折りたたみを1つのhtmlで何個も用意するなら、別のIDを用いること
でないと変な箇所に展開されてしまう・・・

---

もっと単純にdetailsとsummaryでも同じことができるはず・・・・
絶対にそのことは知ってるはずなのに、なんで↑みたいな小難しいことになってるんだろう・・・

detailsの場合はopenとつけると、最初から開かせておくこともできる。

■ 過去記事 : ＜details要素＞ - ディスクロージャーウィジェット

ランキング参加中です

↓クリックしていただけると嬉しいです〜