ScrollMagic и TweenMax запускаются автоматически

Привет всем, я пытаюсь осмыслить все это, играл с этим весь день. Я пытаюсь добиться увеличения фонового изображения (и в конечном итоге стать прозрачным из-за непрозрачности), когда пользователь прокручивает вниз. У меня работает половина желаемого эффекта, но, похоже, он не хочет работать с пользовательской прокруткой, он просто выполняется автоматически.

Это должно быть что-то простое, но я новичок в этом.

вот код, который я написал

    var tween = TweenMax.to('#regular', 0.5, {
    scale: 2
    });

    // Init Controller
    var controller = new ScrollMagic.Controller();


    // Create the Scene and trigger when visible with ScrollMagic
    var scene = new ScrollMagic.Scene({
    triggerElement: '#featured-image',
    reverse: true,
    offset: 700
    })
    .setTween(tween)
    .addTo(controller)

http://codepen.io/anon/pen/EjWLyO


person Phrosty30    schedule 03.06.2015    source источник


Ответы (2)


Ваша основная проблема заключается в том, что setTween метод вашей сцены недоступен, и это связано с тем, что вам не хватает включения animation.gsap.min.js важных плагинов в код, когда дело доходит до использования TweenMax вместе с ScrollMagic .

Поэтому добавьте этот внешний javascript после твоего ScrollMagic включить в ручку и ты золото.

person Tahir Ahmed    schedule 04.06.2015
comment
Привет, Тахир, я вижу себя в том же номере, и у меня есть анимация. Тем не менее, анимация выполняется при загрузке страницы. Если я прокручиваю вниз, ничего не выполняется (точно так же, как я уже был бы внизу страницы). Когда я снова прокручиваю вверх и вниз, все работает правильно. Вы знаете какое-нибудь решение? - person mkbrv; 13.01.2019
comment
привет @mkbrv! давно я использовал ScrollMagic или TweenMax, поэтому мои знания могут быть немного устаревшими, плюс я уверен, что с тех пор все могло немного измениться. однако есть форумы GreenSock, а также Github Issues for ScrollMagic, где вы можете попробовать задать свой вопрос или просто попробовать задать свой новый вопрос здесь, в SO, с соответствующими тегами, воспроизводимой проблемой и деталями, а также уверен, что кто-нибудь сможет вам помочь. Прошу прощения, что не смог вам помочь. удачи! - person Tahir Ahmed; 13.01.2019

У меня аналогичная проблема, хотя я использую вышеописанное решение для javascript. Для моего конкретного случая я нашел решение, описанное здесь:

https://greensock.com/forums/topic/16014-staggerfrom-always-runs-on-page-load-not-on-scroll-magic-event/

Установите в каждой анимации движения параметр: instantRender: false

Я также запускаю вызов TweenMax для установки начальных параметров после инициализации всей сцены.

person mkbrv    schedule 13.01.2019