问题标签 [scrollmagic]

有谁知道我如何使用 ScrollMagic 来产生像这里http://appliancetecltd.com/这样的效果。我想要这样的东西，但我需要更多像这样的运动See Image，但我不知道如何使用它，没有太多关于它使用的文档，有人可以帮助我吗？我这里有一些代码：

但它运作不佳，我不知道如何进行准确的运动。

我正在尝试制作一个伪视差网站。我正在使用 Scrollmagic jquery 插件。我的背景动画工作正常，但我遇到了第一个文本框（位于灰色栏中）的问题。我将它设置为从 opacity:1 开始并在 opacity:0 之间进行补间。当我加载页面时，div 容器似乎已经将不透明度设置为 0.5。我究竟做错了什么？我尝试将 TweenMax.to 中的持续时间调整为 0.5，并且我发现 .text-background 的补间方式没有区别。

Codepen 可在此处获得：http ://codepen.io/anon/pen/vExZPR

谢谢你。

我在滚动时使用 scrollmagic 为对象设置动画，但出现此错误：

未捕获的类型错误：无法分配给#design-principles 的只读属性“_gsTweenID”

我的 JS 代码：

我正在尝试根据 use-init 样板建立一个使用 requirejs 的网站。它在大多数系统和大多数浏览器中都能正常工作。但它在随机系统版本（iMac、MBP）和随机 Safari 版本（在 Safari 6、7 和 8 中发生）的 safari 中失败（与 'scrollmagic'、'fullpage.js' 和其他脚本结合使用）。在这种情况下，浏览器只显示了几个元素，在滚动时挣扎并在一段时间后崩溃。

更新：它适用于未压缩的测试设备，但不适用于构建版本（r.js）

虽然我不知道这种行为的原因，但我试图抓住每一个错误。我不知道错误的行为是否是由于我缺乏知识，我是否做了完全错误的事情，或者是否在使用的工具之一中存在错误。所以我想问你——你对我有什么提示吗？

我不确定 requirejs 中插件的正确实现。我认为我正确使用了“scrollmagic”，但我不确定“fullpage.js”。是否可以编写类似模块的“fullpage.js”使用，或者按照下面给出的细节使用正确？已经研究过文档，因为我第一次使用所有的东西，我将不胜感激！

最好的问候
Jakob
—<br> http://jakob.grommas.com/bt/
http://jakob.grommas.com/bt-raw/

万一做错了，这里详细介绍了配置、主要和模块。

配置.js：

主.js：

模块/fullpage.js：

模块/scrollmagic.controller.js：

模块/scrollmagic.scene.js：

当触发器被激活时，我尝试使用 Scrolltomagic 滚动部分。

当该部分被激活时，它应该上升到页面的顶部。但滚动不工作。

当它被触发器激活时，如何使该部分进入顶部？

完整代码：http: //jsfiddle.net/thallysondias/14ktjsb7/4/

ps：任何优化我的代码的建议，也许是一种干净的方式

我对scrollmagic很陌生，我希望在整个页面中多次使用单个类来制作动画。这可能吗？

见笔

欢迎任何指点。

我正在尝试使用 ScrollMagic 和 GSAP 重建此介绍效果：http://airnauts.com注意介绍“幻灯片”（带有文本）在滚动时如何显示和消失。

基本上，我已经为动画设置了一个舞台控制器、一个场景（包含 div - '.hero-unit'）和一些补间。但是，我只是无法掌握如何按这样的顺序为每张幻灯片（总共三张）制作动画：

1. 您进入网站并开始滚动。
2. 第一张幻灯片是动画的（使用 staggerFromTo 方法）。
3. 当幻灯片完全动画化后，将其不透明度降低回 0（或将其移出屏幕或其他）。
4. 显示第二张幻灯片，如 2 所示。
5. 与 3. 相同，依此类推。

我尝试了所有我设法在互联网上找到的解决方案。我尝试使用“TimelineMax”，尝试在使用 onComplete 为幻灯片设置动画后隐藏幻灯片，但似乎没有任何效果。这是我到目前为止的代码：

回顾一下：如何在滚动时设法呈现不同的场景并在它们之间通过漂亮的过渡进行切换？

我是scrollmagic的新手，我想在不同的触发器上使用相同的补间以避免代码重复。例如：

但只工作最后两个场景。为了使它起作用，我必须在每个场景中重复补间。可以制作可重复使用的补间吗？

我想使用 scrollmagic 在我的页面上产生效果。我的滚动场景已定义并且有效。现在我希望页面在场景未完成时停止滚动。

我试图将我的场景放在一个容器中，overflow-y: scroll;但这在 Firefox 上不起作用。（我必须单击该部分，然后滚动它。）

那么是否可以在我的场景未完成时禁用整个页面的滚动？

我有一个使用 jQuery 和 ScrollMagic 的网站。当用户滚动到特定元素时，ScrollMagic 会捕获该元素并使用 TweenMax 触发动画。

在 jQuery 中，代码如下所示

在新版本的站点中，页面的一部分包含更复杂的动画，可以通过 AngularJS 的双向数据盲法轻松处理，我想利用这一点。我是 AngularJS 的新手，但我用 AngularJS 编写了几个应用程序。我正在努力思考解决此问题的正确方法。本质上，这就是我想要发生的事情。当用户滚动到#animation_start时，AngularJS 驱动的动画就会开始。在伪 jQuery 中，它看起来像这样：

我知道我想错了，因为我还在想 jQuery。我应该如何解决这个问题以及我应该如何构建代码？

任何帮助表示赞赏。