modal开启时页面“向左跳”是因bootstrap 5+为补偿滚动条隐藏而给body加padding-right，但fixed元素不响应此样式；推荐用data-bs-backdrop="static"禁用背景关闭以彻底规避，或为所有fixed元素添加.is-fixed类让bootstrap自动同步补偿。
为什么Modal一开页面就“向左跳”
这不是模态框渲染慢或JS卡顿，而是Bootstrap 5+在show.bs.modal触发时，主动给body加内联样式padding-right: 17px（值随系统滚动条宽度浮动），用来补偿overflow: hidden导致的滚动条消失。但position: fixed元素（比如.fixed-top导航栏、全屏背景图）不响应这个padding-right，结果就是流式内容左缩、fixed层原地不动——看起来像整个页面被吸向左。
- macOS或启用了
scrollbar-width: none的环境里，这个估算值可能为0，反而造成右侧空白 - 用了
overlay-scrollbars等第三方滚动库后，DOM宽度计算失效，补偿逻辑直接错乱 - 如果全局CSS写了
body { padding-right: 0 !important }，会直接覆盖Bootstrap注入的值，抖动更明显
data-bs-backdrop="static"是最稳解法
它跳过整个滚动条补偿流程：不加modal-open类、不设padding-right、不改body的overflow，只禁用点击遮罩关闭，保留ESC键关闭能力。
- 写法：
<div class="modal" data-bs-backdrop="static"> <li>可叠加<code>data-bs-keyboard="false"等其他属性 - 不污染CSS优先级，无兼容性风险，也不需要监听事件或手动操作DOM
- 适合权限确认、表单提交成功提示、单次操作反馈等不需要点背景关闭的场景
- 所有自定义fixed元素都得加：
<nav class="navbar fixed-top is-fixed"></nav>、<div class="hero-bg is-fixed"> <li>漏掉任何一个（比如悬浮按钮、广告位、全屏视频容器），Modal打开时就会明显错位 </li> <li> <code>.is-fixed本身无样式，是纯语义钩子；Bootstrap JS靠它识别并同步补偿 - 别用
$('.modal').hasClass('show')判断，DOM可能不同步 - 监听
hidden.bs.modal时，先统计当前可见Modal数量：document.querySelectorAll('.modal.show').length - 只有数量为0时，才移除
modal-open类
⚠️注意：一旦后续需求变更要支持点击遮罩关闭，就得切回默认行为——这时候如果之前手动加过padding-right或modal-open逻辑，抖动会重新出现。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
必须支持点击遮罩关闭？那就加.is-fixed类
Bootstrap内部会自动为带.is-fixed的position: fixed元素同步增删padding-right，无需额外JS。
多层Modal关闭后背景意外可滚？检查.show实例数
Bootstrap默认“任意一个Modal关闭就删modal-open”，嵌套时上层还在显示，下层一关，背景就漏出滚动。
真正容易被忽略的是：不是所有fixed元素都加了.is-fixed，漏一个就错位；而data-bs-backdrop="static"看似简单，但切换回默认行为时若没清理历史补偿逻辑，抖动会卷土重来。
