Css 如何在gsap中使用ScrollTrigger_Css_Scroll_Triggers

Css 如何在gsap中使用ScrollTrigger

css scroll triggers

Css 如何在gsap中使用ScrollTrigger,css,scroll,triggers,Css,Scroll,Triggers,我已经在HTML中的body标记之前包含了cdn核心链接和scrollTrigger链接。gsap动画在没有scrollTrigger的情况下工作。我正在尝试在不起作用的卷轴上设置动画。有人能告诉我是怎么回事吗？在我想要设置动画的特定div之前，我还有一些其他div，以便获得一些垂直滚动的空间。我没有在这里包括其他div和CSS **HTML** <body> <div class="outer-countainer section-three

我已经在HTML中的body标记之前包含了cdn核心链接和scrollTrigger链接。gsap动画在没有scrollTrigger的情况下工作。我正在尝试在不起作用的卷轴上设置动画。有人能告诉我是怎么回事吗？在我想要设置动画的特定div之前，我还有一些其他div，以便获得一些垂直滚动的空间。我没有在这里包括其他div和CSS

 **HTML**   
    <body>
    <div class="outer-countainer section-three">
        <div class="inner-countainer section-three-inner">
            <h2 class="tree heading"> para text heading  </h2>
                <p class="p-text"> opara rets gdh text to simple text for sample. ara rets gdh text to simple text for sample.  para rets gdh text to simple text for sample. ara rets gdh text.
                </p>
        </div>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.1/gsap.min.js" integrity="sha512-cdV6j5t5o24hkSciVrb8Ki6FveC2SgwGfLE31+ZQRHAeSRxYhAQskLkq3dLm8ZcWe1N3vBOEYmmbhzf7NTtFFQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
        
        <!-- Scroll Trigger -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.1/ScrollTrigger.min.js" integrity="sha512-Q+G390ZU2qKo+e4q+kVcJknwfGjKJOdyu5mVMcR95NqL6XaF4lY4nsSvIVB3NDP54ACsS9rqhE1DVqgpApl//Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    
    <script>
    gsap.to(".section-three-inner", {
      x: 500,
      scrollTrigger: ".section-three-inner", 
    });
        </script>   
    </body>
    </html>

**HTML**
准文本标题
opara将gdh文本重新转换为简单文本作为示例。ara将gdh文本重新转换为简单文本作为示例。para将gdh文本重新转换为简单文本作为示例。ara rets gdh文本。

gsap.to（“.第三节内部”{
x:500，
滚动触发器：“.第三节内部”，
});