火狐等现代浏览器默认拦截非用户主动触发的window.open()，因其判定为潜在广告或恶意跳转；仅允许在click、keydown等用户事件同步执行上下文中调用，异步操作（如fetch.then）会中断信任链导致拦截。
为什么直接用 window.open() 会失败
浏览器现在对非用户主动触发的弹窗拦截极严，window.open() 在页面加载、定时器、fetch 回调里调用，基本 100% 被静默屏蔽。控制台只报 Blocked opening 'xxx' in a new window because the request was made without user activation. —— 这不是代码写错了，是 UA 策略卡死的。
position: fixed 悬浮广告必须配齐的三个 CSS 属性
只写 position: fixed 不够，漏掉任意一个都会导致广告不可见、错位或被遮挡：
-
top或bottom+left或right（必须至少指定两个方向值，否则默认堆在左上角） -
z-index≥ 999（导航栏、轮播图、第三方 SDK 常用z-index: 99或1000，设成9999更稳妥） -
pointer-events: auto（如果父容器设了pointer-events: none，整个悬浮层会失焦，关闭按钮点不动）
移动端右下角悬浮窗关不掉？检查 touch-action
iOS Safari 和部分 Android WebView 下，点击关闭按钮要等 300ms 才响应，用户常误以为“点无效”。根本原因是浏览器默认启用延迟点击检测：
- 给悬浮容器加
touch-action: manipulation，能禁用延迟，让点击立刻生效 - 避免用
top: 20px; right: 20px—— 小屏下按钮太靠近边缘，难按；改用bottom: 10px; left: 50%; transform: translateX(-50%)居中更友好 - 关闭按钮的
onclick内联写法容易失效（尤其在动态插入的广告中），建议用事件委托或addEventListener绑定
刷新后广告又弹出来？别靠 JS 控制显隐
单纯用 JS 控制 display: none 只是视觉隐藏，DOM 还在，下次刷新照样加载。真正防重复的关键是状态持久化：
- 用户点关闭后，存个
localStorage.setItem('ad_closed', 'true') - 页面初始化时先读
localStorage.getItem('ad_closed')，为'true'就跳过插入广告逻辑 - 注意：不要在
里直接内联大量广告 JS，延迟到DOMContentLoaded后再加载，避免阻塞首屏
最麻烦的不是怎么让它浮起来，而是怎么让它“该出现时才出现、该消失时彻底消失、该关掉时一秒响应”——这三件事，每件都卡在浏览器策略、移动端兼容性和用户行为路径的交界处。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
