ScrollMagic setClassToggle Persistance?

Я использую метод setClassToggle() из ScrollMagic. Идея состоит в том, что когда вы прокручиваете вниз и проходите через триггер, вы можете добавить класс css к элементу. И если вы прокрутите вверх мимо триггера, он удалит класс из элемента. Как описано в документации здесь:

http://scrollmagic.io/docs/ScrollMagic.Scene.html#setClassToggle

Eg. 

scene.setClassToggle("#my-elem", "myclass");

Однако я НЕ хочу, чтобы класс удалялся, когда вы прокручиваете вверх перед триггером. Я только хочу, чтобы класс был добавлен и PERSIST после того, как вы прокрутите вниз и пройдете триггер. Как мне заставить Scroll Magic вести себя таким образом? Это вообще возможно?


scrollmagic
person John    schedule 29.01.2018    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Вам нужно установить reverse как false. Возможно, по умолчанию установлено значение true

обратная сторона: ложь

http://scrollmagic.io/docs/ScrollMagic.Scene.html#reverse

person Adam G    schedule 24.09.2018

arrow_upward
1
arrow_downward

Обновить

event.scrollDirection это то, что вы ищете.

var myScene = new ScrollMagic.Scene({
        ...
    })
    .on('start', function (event) {
        // only run on scroll down
        if(event.scrollDirection == 'FORWARD') {
            // do things here, like adding a class
        }
    })
    .addTo(controller);

Исходный

scene конечное событие, по-видимому, имеет такой эффект. В следующем фрагменте добавляется имя класса, которое сохраняется при прокрутке вверх или вниз после первоначального завершения сцены. (В этом примере используется jQuery для простого добавления класса.)

var myScene = new ScrollMagic.Scene({
        ...
    })
    .on('end', function(event) {
        $('body').addClass('my-class');
    })
    .addTo(controller);
person cuka    schedule 14.03.2019