右下角弹窗被遮挡或随滚动的根本原因是未设置 shade: false、closebtn: 0，或父容器含 transform 等 css 属性破坏 fixed 定位；正确写法为 offset: 'rb'，并确保 dom 已挂载。
layer.open 直接支持右下角定位，不用额外写 css 或监听滚动，但必须设对 offset 和 shade，否则会遮挡操作或位置漂移。
为什么右下角弹窗总被遮住或随页面滚动？
根本原因是没关遮罩层、没禁用关闭按钮，或者父容器有 transform 破坏了 fixed 定位。Layui 默认 fixed: true，但一旦父级加了 transform: scale(1) 或 rotate(0)，fixed 就失效，弹窗会跟着滚动。
-
shade: false必须显式设置，否则半透明遮罩层会盖住页面其他操作 -
closeBtn: 0推荐设为 0，避免用户误点关闭，尤其用于自动提示场景 - 检查外层容器是否含
transform、perspective或filter—— 这些会让fixed相对于该容器定位，而不是视口 - 如果用了 Vue/React 动态渲染，确保
layer.open在 DOM 挂载后调用，否则可能因节点未就绪导致 offset 计算异常
offset: 'rb' 是唯一可靠写法，别用像素偏移
rb 表示 right-bottom（右下角），是 Layui 内置方位符，浏览器兼容性好、计算稳定；而写成 offset: ['20px', '20px'] 或 offset: 'bottom-right' 都不被识别，会退回到居中。
- 可用方位符只有：t（上）、r（右）、b（下）、l（左）、rt（右上）、rb（右下）、lt（左上）、lb（左下）
- 想留点边距？直接在
content的内联样式里加margin，比如：content: '<div style="margin:10px">✅ 成功</div>' - 不要试图用
style覆盖.layui-layer的top/right—— layer 会在重绘时重置，且不同版本行为不一致
自动销毁 + 倒计时显示要分开处理
time 参数只控制自动关闭，不能显示倒计时数字；要展示“5s后关闭”，得手动操作 DOM 或用 success 回调启动定时器。
-
time: 5000会让弹窗 5 秒后自动销毁，但用户看不到剩余时间 - 倒计时需在
success中操作：success: function(layero){ let sec = 5; const timer = setInterval(() => { layero.find('.countdown').text(--sec); if (sec - 注意：倒计时结束后别忘了
layer.close(layer.index)，因为time可能已被用户提前关闭，不能依赖它保证销毁 - 如果弹窗内容是 iframe，倒计时逻辑要放在 iframe 内部，
layero拿不到子页面 DOM
多个右下弹窗堆叠时容易错位
Layui 默认不管理多个同方位弹窗的垂直间距，连续调用 layer.open({offset:'rb'}) 会导致它们重叠，而不是依次向上堆叠。
- 没有内置“通知队列”机制，得自己维护一个栈或计数器，动态算
offset像素值，例如：offset: ['calc(20px + ' + (stackIndex * 80) + 'px)', '20px'] - 更稳妥的做法是复用同一个弹窗实例：先
layer.msg()显示基础提示，再用layer.open打开带操作按钮的完整通知框，避免视觉混乱 - 移动端屏幕窄，
area别设死宽高，用area: ['90%', 'auto']配合maxWidth: 300更安全
右下角弹窗看似简单，但真正稳定运行的关键不在样式，而在 fixed 定位的上下文、offset 的语义化取值、以及多实例下的堆叠逻辑 —— 这三点漏掉任一个，都会在上线后突然失效。
