gsap-Timeline

 // 创建时间轴实例
        const tl = gsap.timeline({
            repeat: -1,    // 无限重复整个时间轴动画
            repeatDelay: 1 // 每次重复之间的延迟时间（秒）
        });

        // 添加连续的动画
        tl.to('.box1', {
            y: -100,          // Y轴向上移动100像素
            duration: 0.5,    // 动画持续时间0.5秒
            ease: "power1.out" // 缓动效果：开始快然后减速
        }, "-=0.25")  // 相对位置参数：在前一个动画结束前0.25秒开始
        .to('.box2', {
            y: -100,          // Y轴向上移动100像素
            duration: 0.5,    // 动画持续时间0.5秒
            ease: "power1.out" // 缓动效果：开始快然后减速
        }, "-=0.25")  // 相对位置参数：在前一个动画结束前0.25秒开始
        .to('.box3', {
            y: -100,          // Y轴向上移动100像素
            duration: 0.5,    // 动画持续时间0.5秒
            ease: "power1.out" // 缓动效果：开始快然后减速
        }, "-=0.25")  // 相对位置参数：在前一个动画结束前0.25秒开始
        .to('.box1, .box2, .box3', {
            y: 0,             // Y轴回到原始位置
            duration: 0.5,    // 动画持续时间0.5秒
            ease: "bounce.out" // 弹跳效果：在终点处弹跳
        });