ScrollMagic - Добавить класс навсегда, не удалять при прокрутке назад

Question

Все, что я хочу сделать, это добавить класс в div при первом просмотре, а затем оставить его там. (Итак, я не хочу переключать его - просто включите его один раз). У меня есть анимация, основанная на добавлении класса в родительский div, и хотя я указал направление, когда я проверяю его в инспекторе, он все равно удаляет класс на обратной прокрутке. Я не хочу, чтобы анимация запускалась каждый раз, когда она прокручивалась, а только в ПЕРВЫЙ раз (и затем оставалась там в состоянии завершенной анимации).

var controller = new ScrollMagic.Controller();

var scene = new ScrollMagic.Scene({
triggerElement: '#intro',
offset: 50
})
.on("start", function(e) { 
    if (e.scrollDirection === "FORWARD") {
        $('#welcome').addClass('animated');}
    })
.addTo(controller);

Я попытался добавить продолжительность, но это не имело никакого эффекта. Какие-либо предложения?

Answer 1

Да, вы можете добавить .reverse(false) в вашей сцене. Это приведет к тому, что анимация произойдет только один раз, поэтому, если вы прокрутите ее вверх, она не отключит класс.

Вот пример того, как его использовать, и ссылка ниже на очень простую демонстрацию с его использованием. Также для получения дополнительной информации здесь есть еще одна ссылка на документацию.

обратное (ложь)

$(document).ready(function(){
  var controller = new ScrollMagic.Controller();

  var scene = new ScrollMagic.Scene({
    triggerElement: '.title',
    triggerHook: .6
  })
  .setClassToggle('.title', 'animate')
  .reverse(false)
  .addIndicators()
  .addTo(controller);

});

CodePen Demo