很多做小程序运营的朋友都遇到过这个头疼的问题：辛辛苦苦设计的浮窗，用户点一下或者滑动两下就消失了，根本来不及展示核心信息，更别说引导成交了。这不仅仅是技术设置上的一个小疏忽，它直接关系到你的潜在客户能不能在关键决策节点上，被你“推一把”。今天我们就来彻底解决这个问题，让你小程序的浮窗变成一个“粘人”的成交助手，而不是一个稍纵即逝的广告牌。

一、 先搞懂浮窗“消失”的真正原因，别急着改代码

上来就搜“怎么设置不消失”，然后复制一段代码贴上，结果发现还是有问题。这是因为浮窗消失通常分三种情况，每种情况的解法完全不同。第一，是页面滚动导致的消失，比如用户往下翻商品列表，浮窗跟着滚走了。第二，是点击交互后的消失，比如用户点了一下浮窗上的“关闭”或“跳转”，它就没再回来。第三，是定时自动消失，比如你设置了一个3秒后自动隐藏的浮窗，但用户还没来得及看。

举个例子，你是一个卖高端茶叶的小程序，在首页放了一个“免费领茶样”的浮窗。用户刚看到，手一滑往下翻看产品详情，浮窗没了。等他翻完回来，根本想不起来刚才有个领茶样的入口。这就是典型的“滚动消失”问题。而如果你设置的是“点击浮窗后跳转到领茶样页面，然后浮窗消失”，用户填完资料返回首页，发现浮窗没了，他想再领一份给朋友，却找不到入口了。这两种场景，解决思路完全不一样。

二、 把浮窗“钉”在屏幕上：固定定位与层级覆盖

要让浮窗不随着页面滚动而消失，核心操作是修改它的CSS样式。在小程序的.wxss文件里，找到浮窗对应的类名，加上position: fixed;属性。这一步是基础，但漏掉了关键点：一定要同时指定 z-index 为一个较大的值。比如设置 z-index: 9999;。为什么？因为小程序里有很多原生组件（比如地图、视频、canvas），它们的层级非常高，如果不提高浮窗的层级，浮窗就会被这些组件盖住，看起来就像“消失了”。

实际操作步骤：打开你的小程序项目，找到浮窗组件的.wxss文件。在样式代码里写入：

.my-float-window { position: fixed; top: 80%; left: 5%; width: 150rpx; height: 150rpx; z-index: 9999; }

这里的 top 和 left 可以根据你的设计调整，但 fixed 和 z-index 是核心。有一个小细节：如果你的浮窗里包含按钮或图片，并且你希望它在所有页面上都固定显示，你需要把这个样式写在全局的 app.wxss 里，而不是某个页面的局部样式里。否则，当你跳转到其他页面时，浮窗会丢失。

对比一下：如果你用的是 position: absolute;，那么浮窗会跟随页面滚动，用户一划就没了。而 fixed 就像把浮窗“钉”在了手机屏幕上，无论用户怎么上下滑动，它始终在那个位置。对于成交场景，比如“限时优惠倒计时”浮窗，这种固定不动的设计能持续给用户紧迫感。

三、 让浮窗“去而复返”：控制显示与隐藏的逻辑

固定位置解决了滚动消失的问题，但用户点击浮窗后，它还是会消失。这时候需要调整的是显示/隐藏的控制逻辑。很多开发者会在点击事件里直接写 this.setData({ showFloat: false })，让浮窗彻底隐藏。但为了成交，我们更希望它只是暂时隐藏，或者换个形式出现。

一个独家的做法是：设置一个“冷启动”时间。比如用户点击浮窗领取了优惠券，浮窗可以缩小成一个很小的“气泡”或“红点”图标，停留在屏幕角落，而不是完全消失。然后设定一个定时器，比如30分钟后，或者用户返回首页时，这个气泡重新展开成完整的浮窗。代码实现上，你可以用 wx.setStorageSync 记录用户点击的时间戳，然后在页面加载时判断当前时间与记录时间的时间差，如果超过30分钟，就重新显示浮窗。

具体操作：在浮窗的点击事件处理函数里，先记录时间：
wx.setStorageSync('float_click_time', Date.now());
this.setData({ floatMode: 'mini' }); // 切换成迷你模式
然后在页面的 onShow 生命周期里，读取这个时间：
let lastTime = wx.getStorageSync('float_click_time');
if (Date.now() - lastTime > 30 * 60 * 1000) { this.setData({ floatMode: 'full' }); }

这样做的好处是，用户不会因为一个浮窗反复打扰而反感，但又不会彻底失去这个成交入口。比如你是一个教育类小程序，浮窗是“免费试听课报名”，用户第一次点击报名后，浮窗缩成一个小红点，等他上完试听课回来，小红点又变成了“领取正式课优惠券”的完整浮窗。这种递进式的交互，比简单粗暴的“永不消失”更高级，成交转化率也更高。

四、 对付“自动消失”的定时器：重置与条件触发

有些浮窗为了不干扰用户，会设置几秒后自动消失。但在成交场景下，用户可能正在犹豫，浮窗突然没了，就等于失去了临门一脚的机会。正确的做法是：把自动消失改为“条件触发消失”。比如浮窗显示后，只有用户主动点击了“我知道了”或者“立即购买”，才消失；或者用户滚动到页面底部，浮窗自动收起；或者用户停留超过10秒没有操作，浮窗才自动隐藏。

代码上，你可以取消 setTimeout 的自动隐藏，改为监听页面滚动事件。在页面的 onPageScroll 函数里，获取滚动距离 scrollTop，当 scrollTop 大于某个阈值（比如页面高度的80%），就执行隐藏浮窗的逻辑。这样做的逻辑是：用户已经看完了主要内容，浮窗的使命暂时完成，可以退场，但当他回到页面顶部时，浮窗应该再次出现。

举个例子，一个卖护肤品的详情页，浮窗是“领取小样”。用户刚进来，浮窗显示。他往下看成分介绍、用户评价，当他看到页面底部准备离开时，浮窗自动消失，同时弹出一个更醒目的“立即购买”按钮。而如果用户只是滑到中间又滑回去，浮窗会一直显示。这种动态控制，比固定几秒消失要聪明得多，因为它是根据用户行为来决策的，更像一个懂你的销售员。

五、 一个容易忽略的陷阱：分享页面与浮窗状态

很多小程序有分享功能，用户把页面分享给好友后，好友点进来看到的浮窗，和你自己看到的可能不一样。这是因为分享页面会重新走生命周期，如果浮窗的显示状态依赖于本地存储（比如上面说的点击时间戳），那么新用户进来时，本地存储是空的，浮窗会按默认状态显示。但如果你希望分享出去的页面也带有同样的浮窗策略，就需要在 onLoad 里做一次初始化判断。

更严重的问题是：用户从浮窗跳转到另一个小程序页面，再返回时，浮窗可能丢失。这是因为跳转时，当前页面被销毁，返回时重新创建，如果浮窗的显示逻辑只写在某个页面的 onLoad 里，而没写在 onShow 里，就会导致浮窗不出现。所以，建议把浮窗的初始化显示逻辑，同时放在 onLoad 和 onShow 里，并且用 setData 来确保视图更新。或者更好的方式，把浮窗做成一个全局组件，在 app.js 里管理它的状态，这样无论页面怎么跳转，浮窗都坚挺存在。

六、 成交场景下的独特技巧：浮窗“分身术”

最后分享一个提升成交率的实战技巧：不要让浮窗只有一个形态。根据用户在小程序里的行为，动态切换浮窗的内容。比如用户浏览了A商品3次以上，浮窗从“全场满减”自动变成“A商品专属优惠”；用户把商品加入购物车但没付款，浮窗变成“支付提醒”；用户刚注册，浮窗变成“新人大礼包”。这种变化不需要用户重新打开页面，只需要在后台监听用户行为数据，然后通过 setData 更新浮窗的图片和链接即可。

具体实现：在浮窗组件的 properties 里定义一个 type 属性，然后在页面逻辑里，根据用户行为（比如点击次数、停留时长、加购事件）动态修改这个 type。浮窗组件内部根据 type 显示不同的内容。比如 type: 'coupon' 显示优惠券，type: 'remind' 显示支付提醒。这样做，浮窗永远不会让用户觉得“千篇一律”，反而会觉得这个小程序很懂他，自然成交率就上去了。

设置浮窗不消失，本质上不是技术难题，而是对用户心理和成交节奏的把握。从固定定位到动态状态管理，再到行为触发的智能切换，每一步都决定了你的浮窗是“骚扰”还是“助攻”。按上面这些方法调整后，你的浮窗会像一位贴心的导购，始终守在用户身边，在最合适的时机，递上最合适的信息。