GSAP 滚动动效工具包
React动画ScrollTriggerMotion更新于 2026-08-14
使用场景： 构建滚动驱动体验：随滚动 scrub 的英雄区、固定叙事面板、视差效果与滚动触发出场动画。
安装
npx skills add gsap-scrolltrigger-kit克隆
git clone https://github.com/skillhub-community/gsap-scrolltrigger-kit.git描述
一个专为滚动联动动画打造的 ScrollTrigger 工具包。核心模式：滚动触发出场（元素进入视口时动画入场）、scrub 动画（动画进度绑定滚动位置，用于丝滑视差与进度条）、固定分区（内容在滚动旅程中固定，实现经典的「滚动叙事」效果），以及批量触发器高效动画成组元素。
包含 ScrollSmoother 集成，用原生滚动条实现顺滑滚动；支持可滚动 div（不只是窗口）的容器滚动；以及 start/end 定位系统（top top、center center 等）与交互式调试工具。提供 useScrollTrigger React hook，自动注册、刷新与清理——还有图片加载或字体替换导致布局偏移后 ScrollTrigger.refresh() 的指引。
AI Hub
跑 Skill 需要模型接口？
AI Hub 提供 OpenAI 兼容接口，给 Cursor / Claude Code / Agent 用。
打开 AI Hub元数据
作者@motion_kevin
许可证MIT
版本1.0.0
依赖1