Question

我之前使用过superscrollorama，我开始使用scrollmagic，但我无法设法让一些div正确动画。前两个div很好，但最后两个，一旦我向下滚动，没有动画。另外我想为第二个div添加一点偏移，但不知道怎样，语法与Superscrollorama略有不同。

var controller;
    $(document).ready(function($) {
        // init controller
        controller = new ScrollMagic();
    });

$(document).ready(function($) {
        // build tween
        var tween =  new TimelineMax ()
            .add([
                TweenMax.from(".biopic", 0.5, {top: '150',opacity:0}),
                TweenMax.from(".title", 0.5, {left: '150',opacity:0}),
                TweenMax.from(".gallery-wrap", 0.5, {top: '150',opacity:0}),
                TweenMax.from(".title2", 0.5, {right: '150',opacity:0}),
            ]);

        // build scene
        var scene = new ScrollScene({triggerHook: "onEnter", offset: 150 })
                        .setTween(tween)
                        .addTo(controller);
    });

Answer 1

确保TweenMax对象的选择器正确无误您可以通过测试它们来确保它们不会将它们添加到ScrollMagic。

要添加偏移量，您可以使用TweenMax的延迟选项或添加新场景。

如需更多帮助，请按照以下指南操作：https://github.com/janpaepke/ScrollMagic/blob/master/CONTRIBUTING.md

scrollmagic补间动画

1 个答案: