Layui折叠面板动画可通过CSS覆盖transition属性禁用。全局禁用用.layui-colla-content{transition:none!important}，局部禁用则添加自定义class如.no-anim .layui-colla-content{transition:none!important}。

Layui 的折叠面板（collapse）默认展开/收起时带有滑动动画，但官方并未提供直接关闭该动画的配置项。要取消这个效果，核心思路是**覆盖其 CSS 过渡行为**，让高度变化变为即时切换。

方法一：全局禁用 collapse 动画（推荐）

折叠面板的动画由 .layui-colla-content 元素上的 transition 属性控制。只需在页面样式中覆盖它即可：

• 添加以下 CSS（放在 layui.css 之后，或使用 <style></style> 标签内联）：

.layui-colla-content { transition: none !important; }

这样所有折叠面板内容的显示/隐藏都会变成瞬间切换，无任何过渡效果。

深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载

方法二：仅对特定面板禁用动画

如果只想取消某一个折叠面板的动画，可以给它的容器加自定义 class，再针对性覆盖：

• HTML 中为该面板添加标识，例如：
  <div class="layui-collapse no-anim">...</div>
• 对应 CSS：
  .no-anim .layui-colla-content { transition: none !important; }

注意事项

取消动画后，layui-show 类仍可正常使用，内容显隐逻辑不受影响；
若同时使用了手风琴模式（lay-accordion），切换行为依然有效，只是没了滑动过程；
不建议用 JS 强制修改 style.transition，因为 layui 内部会重置样式，CSS 覆盖更稳定可靠。