detailsタグのアニメーションについて - もぐもぐ食べるおいしいWebデザイン。 - もぐでざWordPress6.3でも実装されたdettailsタグ。 これはdetailsのSummaryタグ。 detailsのここが中身。 ↑こんな感じで開閉がCSSやJSを使わずに簡単に実装できる。 しかもアクセシビリティ面も配慮されているのがありがたいところ。 ただ、アニメーションをつけようとすると途端に難易度が上がっちゃう。 いろいろ調べてたどり着いた内容を残しときます。 CSSだけで実装 2025.08.07 追記 CSSのみでdetailsアニメーションをが実現できるようです！ details-content 疑似要素を使って実装する方法です。TAKさんの記事が参考になりました。 https://www.tak-dcxi.com/article/css-only-details-animation-2025 — 以下、過去の記事です — いちおうCSSだけでアニメーションをつけること
