ScrollMagic中是否有办法使setPin持续时间等于时间而不是滚动距离？

问题描述

我有一个补间，可通过滚动到固定的特定部分来触发，然后播放动画。现在，它在触发时播放，与滚动无关，但图钉本身设置为滚动。因此它会播放动画，您必须滚动500像素才能取消固定该部分。理想情况下，插针将持续补间的持续时间，例如500毫秒，而不必滚动像素来取消插针。这可能吗？

以下是当前设置方式的代码：

// // build scenes
    this.controller = new ScrollMagic.Controller();

    let tl = new TimelineMax();
    tl.fromTo(
      ".gradient_lord",0.5,{ css: { transform: "translateY(100%)" } },{ css: { transform: "translateY(0%)" } },"+=.7"
    );
    tl.fromTo(
      "header.header_headline",1,{ css: { opacity: "0" } },{ css: { opacity: "1" } },"-=.03"
    );

    new ScrollMagic.Scene({
      triggerElement: "#TextContent",duration: "25%",triggerHook: 0,})
      // .addindicators({
      //   colorTrigger: "red",//   colorStart: "red",//   colorEnd: "red",//   indent: 5,// })
      .setPin("#TextContent")
      // .setClasstoggle("#GradDad","hello")
      // .on("enter",this.sceneEnter)
      .setTween(tl)
      // .on("progress",function (event) {
      //   console.log("Scene progress changed to " + event.progress);
      // })
      .addTo(this.controller);

    new ScrollMagic.Scene({
      triggerElement: "#TextContent",// duration: 800,// })
      .setTween(tl)
      // .on("progress",function (event) {
      //   console.log("Scene progress changed to " + event.progress);
      // })
      .addTo(this.controller);

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

gsap scrollmagic