gsap motionPath

GSAP（GreenSock Animation Platform）是一个流行的JavaScript动画库，可以轻松地创建各种动画效果。motionPath是GSAP库中的一个功能，它允许您在SVG路径上定义动画的运动路径。

使用GSAP的motionPath，您可以通过指定SVG路径来创建物体的动画运动轨迹。以下是一个示例代码片段，演示如何使用GSAP的motionPath：

// 创建一个TweenMax动画
var tween = gsap.to("#object", {
  duration: 3, // 动画持续时间为3秒
  repeat: -1, // 无限循环
  ease: "power1.inOut", // 缓动函数
  motionPath: {
    path: "#motion-path", // SVG路径的选择器
    align: "#motion-path", // 对齐方式，可以是选择器或DOM元素
    autoRotate: true, // 自动旋转物体以适应路径
    start: 0, // 路径上的起始位置（0-1之间的百分比）
    end: 1, // 路径上的结束位置（0-1之间的百分比）
  }
});

在上面的代码中，我们使用`gsap.to()`方法创建了一个TweenMax动画，将`#object`元素沿着指定的SVG路径`#motion-path`进行运动。我们还指定了动画的一些属性，如持续时间、重复次数、缓动函数等。

请注意，上述代码仅是演示示例，实际使用时需要确保页面中已经存在相应的HTML元素和SVG路径。

希望这可以帮助您理解GSAP的motionPath功能。如有更多问题，请随时提问！