Scrollmagic - твин был перезаписан другим - PullRequest
Новая
       42

Scrollmagic - твин был перезаписан другим

0 голосов
/ 14 октября 2019

Я использую плагин Scrollmagic с Tweemax, но в консоли Chrome появляется предупреждение:

ВНИМАНИЕ: анимация была перезаписана другим. Чтобы узнать, как избежать этой проблемы, смотрите здесь: https://github.com/janpaepke/ScrollMagic/wiki/WARNING:-tween-was-overwritten-by-another

Я читаю страницу, но я не понимаю, что не так в моем коде. Можно мне помочь, пожалуйста? 

    // Scene content leave
    $('.anim-leave').each(function() {

        // Build Tween goodbye
        var sayGoodbye = TweenMax.to($(this), 1, {autoAlpha:0});
        var dataOffset = 0, dataResponsive = 0;

        if (Modernizr.mq('(min-width: 992px)')) {
            var dataOffset = 20;
            var dataResponsive = 0.70;
        } else {
            var dataOffset = 200;
            var dataResponsive = '80%';
        }

        // Element sticky
        var fadeGoodbye = new ScrollMagic.Scene({
            triggerElement: this,
            offset: $(this).outerHeight() - dataOffset,
            triggerHook: dataResponsive
        })
        .setTween(sayGoodbye)
        .addTo(controller);
    });

    // Scene stagger
    $('.anim-stagger-s').each(function() {

        // Build Tween up and show
        var stagger = TweenMax.staggerFromTo($(this).find('.anim-element'), 1,
        {
            opacity: 0,
            delay: 0,
            ease: Power2.easeOut
        },
        {
            opacity: 1,
            ease: Power2.easeOut
        },
        0.2);

        var showScene = new ScrollMagic.Scene({
            triggerElement: this,
            offset: -150,
            triggerHook: 0.55,
            duration: $(this).outerHeight()
        })
        .setTween(stagger)
        .addTo(controller);
    });

    // Scene stagger
    $('.anim-stagger-v').each(function() {

        // Build Tween up and show
        var stagger = TweenMax.staggerFromTo($(this).find('.anim-element'), 1,
        {
            y: 200,
            opacity: 0,
            delay: 0,
            ease: Power2.easeOut
        },
        {
            y: 0,
            opacity: 1,
            ease: Power2.easeOut
        },
        0.2);

        var showScene = new ScrollMagic.Scene({
            triggerElement: this,
            offset: -150,
            triggerHook: 0.55,
            duration: $(this).outerHeight()
        })
        .setTween(stagger)
        .addTo(controller);
    });

    // Scene stagger
    $('.anim-stagger-h').each(function() {

        // Build Tween up and show
        var stagger = TweenMax.staggerFromTo($(this).find('.anim-element'), 1,
        {
            x: -80,
            opacity: 0,
            delay: 2,
            ease: Power2.easeOut
        },
        {
            x: 0,
            opacity: 1,
            ease: Power2.easeOut
        },
        0.5);

        var showScene = new ScrollMagic.Scene({
            triggerElement: this,
            offset: -150,
            triggerHook: 0.55,
            duration: $(this).outerHeight()
        })
        .setTween(stagger)
        .addTo(controller);
    });
...