framer-motion-animations

用途：为 React/Next.js 项目添加细微动画，覆盖首屏（hero）、卡片揭示、页面切换和滚动触发效果。安装：npm install framer-motion。主要能力与示例：基础淡入（motion.div 配合 initial/animate/transition）；交错子元素（variants 容器与 staggerChildren）；滚动触发（useInView 配合 useRef，once 与 margin 控制触发）；首屏分段延迟动画；卡片悬停（whileHover 位移与阴影）；区块包裹（AnimatedSection）；数字计数（useMotionValue、useTransform、animate）；页面切换（AnimatePresence 配合 usePathname）；手风琴展开（AnimatePresence 与高度动画）。用法要点：组件需标注 'use client'；动画参数通过 initial、animate、exit、transition、variants 配置。性能建议：共享元素过渡用 layoutId；用 useReducedMotion() 尊重用户偏好；避免动画 width、height 等布局属性，改用 transform；谨慎使用 will-change；优先 opacity 与 transform 以利用 GPU 加速。限制：资料未提供版本要求、浏览器兼容性、收费与授权信息，暂未提供。