了解 Webflow IX3 新推出的滑鼠移動觸發器、滑鼠跟隨動作與間隔動作，打造原生游標驅動動畫，支援平滑緩動、多元素交錯跟隨、速度/距離觸發。
Webflow IX3 新增滑鼠移動動畫觸發器，支援 GSAP 驅動的互動效果
發布日期：2026 年 7 月 20 日
類別：Interactions
概述
Webflow IX3 引入三個新的原生互動原語，底層建構於 GSAP 的 Observer 與 quickSetter，解決了設計師過去必須手寫 GSAP 或自訂程式碼才能實現的游標驅動連續動畫需求。這些原語讓元素的動畫狀態能持續回應游標位置，適用於元素跟隨游標、磁性按鈕、滑鼠移動視差、聚光燈/發光效果追蹤指標等場景。
三大核心原語
1. 滑鼠移動觸發器
- 追蹤範圍：預設相對於觸發元素，可選擇整個視口。
- 輸出值：將游標位置正規化為 X 與 Y 進度值（0 到 1），持續驅動互動時間軸。
- 平滑緩動：可配置平滑時間（預設 50ms）。
- 靜止位置：游標離開時的預設位置（預設為中心點 50/50）。
2. 滑鼠跟隨動作
- 多元素跟隨：不限於觸發元素，可讓其他元素跟隨游標。
- 交錯與鏈式平滑：支援逐元素交錯與鏈式跟隨平滑，具確定性種子排序，實現磁性與視差游標跟隨效果。
3. 間隔動作
- 依距離或速度觸發：根據游標移動的距離或速度觸發動作群組，而非僅依當前位置。
- 動態回應：互動可對「游標移動多快」或「移動多遠」做出反應。
相關更新
- 操控 Rive 動畫使用 Interactions with GSAP
- 將 Interactions with GSAP 引入設計系統
- 使用 Interactions with GSAP 為變數製作動畫
- 跨站複製貼上互動
- Interactions with GSAP 新功能：Spline 動作與緩動視覺化
- Interactions with GSAP 新動作類型：Lottie 與 Set
文件與資源
此功能讓設計師在無程式碼環境下即可建構先進的游標驅動互動，大幅降低開發門檻並提升設計自由度。