javascript - Gsap ScrollTrigger 动画水平

Question

我正在尝试进行水平滚动，而我的项目在移动时缩放到 0.5，但无法在 Foreach 中制作滚动触发器，这是我的代码的代码笔： https ://codepen.io/beatlesbob/pen /eYWMREW

sections.forEach((section,index) => {
    
    let tl = gsap.timeline({
        scrollTrigger: {
            trigger: section,
            pin: true,   // pin the trigger element while active
            start: `top top-=${section.clientHeight*(index)}`, // when the top of the trigger hits the top of the viewport
            end: `+=${section.clientWidth+section.clientWidth*(index)}`, // end after scrolling 500px beyond the start
            scrub:true,
            toggleClass:'active',
            pinSpacing:false,
        }
      });

      tl.to(section, {xPercent: -100 * (sections.length-1)});
});```

Also I cannot put the active class on the current section