Javascript My.js文件赢得'；t链接到我的HTML，无法使scrollmagic工作_Javascript_Jquery_Html_Css_Scrollmagic

Javascript My.js文件赢得'；t链接到我的HTML，无法使scrollmagic工作

javascript jquery html css

Javascript My.js文件赢得'；t链接到我的HTML，无法使scrollmagic工作,javascript,jquery,html,css,scrollmagic,Javascript,Jquery,Html,Css,Scrollmagic,我正在尝试在我的网页上使用ScrollMagic。我在一个.js文件中输入了代码，并将该文件和ScrollMagic cdn链接到了我的html，但这并没有对我的页面产生任何影响我已尝试将../添加到文件链接并添加不同的脚本这是HTML： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=

我正在尝试在我的网页上使用ScrollMagic。我在一个.js文件中输入了代码，并将该文件和ScrollMagic cdn链接到了我的html，但这并没有对我的页面产生任何影响

我已尝试将../添加到文件链接并添加不同的脚本

这是HTML：

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="https://fonts.googleapis.com/css?family=Sarabun" 
rel="stylesheet">
<link rel="stylesheet" href="css/styles2.css">
<title>Example</title>
</head>

<body>
<header>
<h1>Header section</h1>
</header>
<section class="about">
<div class="about-title">
  <h2>About Us</h2>
</div>
<div class="about-pages">
  <div>
    <h2>Project 1</h2>
    <p>Lorem ipsum dolor sit amet, </p>
  </div>
  <div>
    <h2>Project 1</h2>
    <p>Lorem ipsum dolor sit amet, </p>
  </div>
  <div>
    <h2>Project 1</h2>
    <p>Lorem ipsum dolor sit amet</p>
  </div>
  </div>
  </section>


<footer>
<h2> This is the footer </h2>
</footer>

<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.6/ScrollMagic.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.6/plugins/debug.addIndicators.min.js"></script>
<script src="app.js"></script>

</body>

我希望页面的左侧在右侧滚动时保持静止，但它会同时滚动。

我在您的JS代码中看到一些错误。对象属性应该有一个尾随逗号。你少了一个。最后一个分号之后也不应该有分号

new ScrollMagic.Scene({
duration: '200%',
triggerElement: '.about-title',
triggerHook: 0 
})

另一个问题是您有不必要的分号，这会导致链接问题

.setPin('.about-title')
.addIndicators()
.addTo(controller); // This one may need to be removed also

最后，我看到触发器附加到一个类（.about title）。我在您的html中没有看到该类。

我已经编辑了上面的html以显示“关于标题”部分。我把我的JS编辑成你说的那样，但没有用。你认为我需要添加jquery cdn吗？我已经开始工作了，我在运行页面时查看了控制台，发现app.js文件没有找到。添加了../js/app.js（因为它保存在这个文件夹中），视差现在可以工作了。谢谢你的帮助，克莱，就像我以前做的那样，但是我的JS代码中仍然有错误，现在我已经编辑了它，它可以工作了。

.setPin('.about-title')
.addIndicators()
.addTo(controller); // This one may need to be removed also