跳至内容

除除

菜单
  • GitHub+
  • Bootstrap实战+
  • 留言板
  • 友链
Close search bar

标签: 用户体验

使用 max-height 实现动画效果的“展开收起”

2018年7月14日2025年6月12日除除1 条评论
介绍了利用 CSS 设置 max-height 属性在 0 与目标高度之间切换,实现“展开收起”动画效果的方法。通过设置 transition 属性实现平滑过渡,避免使用 JavaScript。需注意 max-height 值不宜过大,以免导致视觉延迟影响动画效果。

分类目录

  • HTML/CSS (42)
  • JavaScript (116)
  • UI 设计 (1)
  • 分享 (7)
  • 后端 (56)
  • 客户端 (1)
  • 工具 (5)
  • 数据结构与算法 (14)
  • 文章 (25)
  • 旅行 (3)
  • 日记 (20)
  • 烹饪 (16)
  • 睡前故事 (4)
  • 网络协议 (4)
  • 读书笔记 (39)
  • 运维 (38)

近期文章

  • - Promise: 异步编程的理解和使用
  • - 前端性能和加载体验优化实践(附:PWA、离线包、内存优化、预渲染)
  • - Postman 使用小技巧/指南

合集

  • - Git 常用命令
  • - npm 常见问题
  • - Webpack 常用配置
  • - 常用横幅尺寸

小工具

  • - 短链接在线生成
  • - Markdown 转 HTML
  • - 拼单计算器
  • - Nginx Tester
  • - 前端常用库 CDN
  • - 开放实验室 · API 文档

标签

ASP Async Bootstrap C CSS CSS3 Debian DOM ECMAScript ECMAScript6 ES6 Front-End Notes Git GitHub GitLab Go Golang H5 HTML HTTP IE JavaScript jQuery JScript Linux MySQL Nginx Node.js npm PHP Promise SQL SQLServer Vue Webpack 优化 异步 性能 散列 数据结构 正则表达式 炒 算法 缓存 鸡蛋
Copyright © 2025 除除 - 苏ICP备16050427号-3
Scroll to top