如何用原生JS将网页元素实现类似手风琴的展开收起效果？
- 内容介绍
- 文章标签
- 相关推荐
本文共计268个文字，预计阅读时间需要2分钟。
在现实网页开发中，手风琴布局出现频率也较高。简单做了个手风琴，但觉得其过渡效果未实现，内容列表出现得过于突兀，效果图如下：
实现代码如下：
手风琴布局 .accordion { width: 100%; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; }
.accordion h3 { background-color: #eee; padding: 10px; text-align: left; border-bottom: 1px solid #ccc; }
.accordion-content { padding: 10px; display: none; }
1 内容1
2 内容2