2016年12月3日のブックマーク (1件)

  • 【Labs】CSSだけでサイズ可変・スマホ対応のアコーディオン

    こんにちは(・∀・) CSS3のAnimationtransitionといったプロパティのおかげでJavaScriptを使わなくても動きのあるWebサイトが作れるようになってきました。そこで今回はCSSだけで作る、サイズが可変してスマホにも対応したアコーディオンをご紹介します。 Contents チェックボックスでアコーディオン ラジオボタンでアコーディオン チェックボックスを使ったアコーディオンとラジオボタンを使ったアコーディオンの2種類です。それぞれの特質にあわせた形でアコーディオンが展開されます。チェックボックスを使ったアコーディオンはその性質上、ボタンを選択(クリック)したら選択した分すべて展開しますが、ラジオボタンのアコーディオンはnameでグループになっているので選択(クリック)した分だけ展開します。また、最初から展開している状態で表示したい場合はinput要素にchecke

    【Labs】CSSだけでサイズ可変・スマホ対応のアコーディオン
    ionvir0
    ionvir0 2016/12/03
    アコーディオンアニメーション