アコーディオンパネル
WEB先案内
WEB制作技術の引き出しを増やすため、自分なりにアレンジしたコードをアウトプットすることにしました。 その中でも特に勉強になったコードを紹介します。 コピペで使えるようになっているので、あなたのサイトで使っていただけるとうれしいです。 あくまでデザインの一例にすぎないので、調整してオリジナルのデザインを作ってみてください！
アコーディオンパネル
おさえておきたいところ
「アコーディオンパネル」を使う目的と使いどころはこんな感じです。 目的：連続する内容をまとめ、項目の全体像を先に伝える 動きのきっかけ：画面の読み込み中 / クリック
任意の場所をクリックすると隠れていた内容が開く
See the Pen 任意の場所をクリックすると隠れていた内容が開く by Web Navigator (@web-navigator) on CodePen.
任意の場所をクリックすると隠れていた内容が開き、先に開いていた内容が閉じる
See the Pen 任意の場所をクリックすると隠れていた内容が開き、先に開いていた内容が閉じる by Web Navigator (@web-navigator) on CodePen.
次回の予定
「ツールチップ」「ニュースティッカー」を作ってみようと思います＼＼\\٩( ‘ω’ )و //／／
合わせて読みたい
アコーディオンパネル
ABOUT ME
あなたのお仕事をする時間を使ってITに関することを調べたり、トライしてみたりして、それでもうまくいかない。そんなことはありませんか？
WEB先案内をご利用いただくと、困ったときにITの顧問としてあなたのITに関するお悩みにお答えし、サポートを行うことができます。