0

我正在使用 ScrollMagic 来获得一些滚动动画。问题是我需要使用偏移量,以便动画在某个滚动点上触发,但这完全取决于窗口高度。

所以在我提供的例子中

https://jsfiddle.net/5tvrnfkx/12/

您可以看到该框出现在滚动条上。https://tppr.me/RpkVa

注意窗口高度https://tppr.me/hoyhs尝试调整高度或预览面板的大小并运行。

所以在426px窗口高度上,它工作得很好。以没有框的方式开始页面并在滚动时进行动画处理。

尝试增加高度并检查https://tppr.me/sYJ5a,该框出现在开头。同样,如果您降低高度,则该框仅在几次滚动后才会出现。

所以我想知道是否有任何方法可以使偏移值动态化,因此在任何窗口高度中,动画都从页面滚动的完全相同的点开始。

4

1 回答 1

1

是的offset,您可以使用triggerHook并将其设置为0(或非常接近),而不是 using 。

像这样:

jQuery(function() {

  var controller = new ScrollMagic.Controller();

    var tween = TweenMax.to("#boxAnim", 1, {className: "+=animate"});
    var scene = new ScrollMagic.Scene({triggerElement: "#trigger", duration: 300, triggerHook: 0})
            .setTween(tween)
            .addTo(controller);


  var height = $(window).outerHeight();

  $('.height').append(height);
});
于 2019-07-29T23:39:38.750 回答