Layui 的 layer.open 默认按调用顺序递增 z-index 实现层叠，不支持原生并排布局；需手动指定 zIndex 和 offset 控制位置，或通过 success 回调动态添加唯一 class 配合 CSS 精确定位。
layui.open 同时打开多个弹窗时 z-index 自动叠加导致遮挡
layui 的 layer.open 默认按调用顺序递增 z-index，后开的窗口总在最上层，根本不是“并排”，而是“叠罗汉”。这不是 bug，是设计如此——它压根没提供原生的并排布局能力。
真正能控制位置和层级的，只有手动传入 zIndex + offset，且必须自己算好坐标，否则窗口会重叠或跑出视口。
- 每次调用
layer.open时显式指定zIndex（比如从 1000 开始，每次 + 10） - 用
offset控制位置：['100px', '200px']表示距顶部 100px、左侧 200px；'auto'会回到居中，别用 - 避免用
type: 2（iframe 层）+area宽高不一致，容易因内容撑开导致错位
用 CSS 覆盖 layer 的默认定位逻辑
Layui 弹窗的容器 class 是 layui-layer，但每个实例的 DOM 是独立的，直接写 .layui-layer { left: 100px !important; } 会全局生效，所有窗口一起偏移。
得靠 JS 动态加 class 或改 style，而且要在 success 回调里操作——因为 DOM 渲染完成才可取到节点。
- 在
layer.open的success回调中，用$(this).addClass('my-layer-1')给当前层加唯一 class - 配合 CSS：
.my-layer-1 { left: 50px !important; top: 80px !important; } - 注意：不要用
position: absolute覆盖，Layui 本身用的就是fixed，强行改会丢失响应式行为
多个弹窗共享同一个 zIndex 基础值但互不干扰
如果希望多个窗口“视觉上并排”，又不想手动算每个 offset，可以基于一个基准点做偏移。比如主窗口在居中，第二个右偏 320px，第三个再右偏 320px，以此类推。
关键不是让它们“自动排列”，而是你得定义清楚“并排”的含义：是水平依次排列？还是网格状？Layui 不管这个，只管渲染单个层。
- 维护一个全局计数器，比如
window.layerIndex = 1000，每次 open 后++ - 计算
offset：第 n 个窗口的 left =100 + (n - 1) * 320，top 固定为60 - 务必限制最大数量（比如最多 3 个），否则超出屏幕宽度就看不见了，且
zIndex过大会影响其他组件（如 dropdown、tooltip）
关闭某个弹窗后，剩余窗口的层级和位置要不要重排
不重排。Layui 不维护窗口关系，关掉一个，剩下的 zIndex 和 offset 全部保持原样。如果你期望“关掉中间那个，两边自动靠拢”，那得自己监听 layer.close 并手动调整其余层的 style.left 和 zIndex。
实际项目中几乎没人这么做——用户本就不指望弹窗像桌面程序那样智能管理，只要不遮挡、能看清、不闪跳，就已达标。
- 监听关闭：用
layer.close(index)后，手动遍历layer.getArea(index)获取剩余层信息（需提前存 index） - 重排成本高：要重新计算位置、更新 DOM style、还要防重复触发
- 更稳妥的做法是：允许用户拖拽（开启
move），把位置控制权交还给用户
真实场景里，所谓“并排”往往只是两个关键窗口错开显示，比如一个表单层 + 一个帮助说明层。算好两组 offset 和 zIndex，比搞自动布局靠谱得多。别指望 Layui 替你做窗口管理，它连最小化都不支持。
