概念艺术网站的多个ScrollMagic操作 - 每个操作仅专门工作

Question

我正在尝试在我的网站上结合两种不同的动作，因为我是javascript和scrollmagic的初学者，所以我一直在努力使它们一起工作。我已经成功地使每组行动都有效。我的代码基于Jan Paepke的教程。这是我正在处理的页面的链接：

Multiple scrollmagic actions website

1. 向下滚动时，第一组操作是向左和向右的补间动画。
2. 第二组操作只是为了能够从每个第二个导航链接（page-nav）到其各个部分（#tags）进行scrollTo操作。

在对其进行故障排除时，我注意到，如果我将

包括在内，那么使一个或另一个独立工作的事情就会发生。

<script type="text/javascript" src="js/scrollmagic/ScrollMagic.js"></script>

脚本（包含在ScrollTo tutorial中。似乎是前脚本和jquery

<script type="text/javascript" src="js/scrollmagic/jquery.scrollmagic.js"></script>

可以这么说，

文件正在踩着对方的脚趾。如果包含一个而不包含另一个，那就是对我的.html起作用的动作。无论如何，我一直在努力解决这个问题，而且我不熟悉不同的jquery.scrollmagic或ScrollMagic.js内部分支来解决这个问题。

如果您有任何解决方案或想法，这对我非常有帮助！我相信可能会有更简单的方法来解决这个问题，但我似乎无法在网上找到它...... 谢谢，

阿德里安

Answer 1

这里有几个版本混合在一起。

jquery.scrollmagic.js是版本1.x的旧库文件 ScrollMagic.js是版本2.x的文件的当前库。
plugins/jquery.ScrollMagic.js是版本2.x的jQuery扩展

您可以在相应文件的head部分找到每个信息。

当你发现自己不能同时使用两个不同的版本时，因为它们会“踩到彼此的脚趾”。

我强烈建议您详细了解ScrollMagic在its wiki中的运作方式 此外，您应该阅读并遵循troubleshooting guide。特别是有关检查控制台的有用信息的部分，我不能强调。

语法已从ScrollMagic 1.x更改为2.x所以我的猜测是你的问题在于，一个使用旧语法，一个使用新语法。 如果你使用你的控制台，那肯定是你能想到的东西。