Добавление класса в зависимости от направления прокрутки целевого div от - PullRequest
Новая
       81

Добавление класса в зависимости от направления прокрутки целевого div от

0 голосов
/ 08 июля 2020

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

Ie; при прокрутке сверху веб-сайта контент отскакивает снизу вверх, когда он попадает в поле зрения, но отскакивает от нижней части страницы, когда начальная позиция прокрутки находилась ниже.

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

Вот текущий фрагмент. Рабочий пример в настоящее время находится на "# SEC3CONT"

ВНИМАНИЕ: разделы пронумерованы сверху вниз. 

$(function() {
          $.scrollify({
            section : ".PANEL",
            interstitialSection : ".WELCOMEIMG",  
            scrollSpeed: 600, 
            sectionName : "section-name",  
            before: function (section) {
                console.log(section);
                if(section===1) {
                    $("#SEC2CONT").removeClass("animate__animated animate__bounceInRight")
                }
                if(section===2) {
                    $("#SEC2CONT").addClass("animate__animated animate__bounceInRight")

                    $("#SEC2CONT").addClass("animate__animated animate__bounceInRight")
                    $("#SEC3CONT").removeClass("animate__animated animate__bounceInLeft")
                }
                if(section===3) {
                    $("#SEC2CONT").removeClass("animate__animated animate__bounceInRight")
                    $("#SEC3CONT").addClass("animate__animated animate__bounceInLeft")
                    $("#MAPPER").removeClass("animate__animated animate__bounceInRight")
                }
                if(section===4) {
                    $("#SEC3CONT").removeClass("animate__animated animate__bounceInLeft")
                    $("#MAPPER").addClass("animate__animated animate__bounceInRight")
                }
                
                
            }  
          });

Пожалуйста, помогите!

Спасибо. Джимми

...